Как использовать функцию загрузки по требованию в Nativescript radlistView? - PullRequest
Новая
       34

Как использовать функцию загрузки по требованию в Nativescript radlistView?

0 голосов
/ 25 апреля 2020

Я пытаюсь использовать функцию загрузки по требованию RadlistView в моем основном приложении nativescript . Все примеры, которые я видел, это angular или vue, но мне нужно, чтобы это было сделано с javascript. Я не уверен, что я делаю это правильно, но с тем, что я пробовал, я получаю сообщение об ошибке 'не могу прочитать длину свойства undefined' 

    <lv:RadListView loadOnDemandMode="Auto" items="{{ items }}" loadMoreDataRequested="{{ onLoadMoreItemsRequested }}" separatorColor="transparent" id="list-view" itemTap="{{ onItemTap }}" marginRight="-2" backgroundColor="#e6e6e6" itemLoading="{{ onItemLoading }}">
<lv:RadListView.listViewLayout>
<lv:ListViewGridLayout scrollDirection="Vertical" dynamicItemSize="false" itemInsertAnimation="Slide" itemDeleteAnimation="Default" spanCount="2" />
</lv:RadListView.listViewLayout>
<lv:RadListView.itemTemplate>
<StackLayout margin="15" borderRadius="10">
<i:ImageCacheIt loaded="imageLoaded" placeHolder="res://nopic" stretch="aspectFill" height="130" width="100%" src="{{ 'http://adekunletestprojects.000webhostapp.com/skog/uploads/' + profileIcon }}" />
<StackLayout backgroundColor="white" padding="10">
<Label text="{{ name }}" class="item-name" textWrap="false" />
<Label text="{{ skill }}" class="item-desc" textWrap="false" />
<Label text="{{ phone }}" class="item-price" textWrap="true" />
</StackLayout>
</StackLayout>
</lv:RadListView.itemTemplate>
</lv:RadListView>

это мой взгляд -модель. js

      function SearchViewModel() {
          const viewModel = observableModule.fromObject({
_sourceDataItems: ObservableArray,
        addMoreItemsFromSource: function(chunkSize, number, listView, RadListView)
        {
            let newItems = this._sourceDataItems.splice(0, chunkSize);
            this.items.push(newItems);
            if (listView) {
                // Call the optimized function for on-demand loading finished.
                // (with 0 because the ObservableArray has already
                // notified about the inserted items)
                listView.notifyAppendItemsOnDemandFinished(0, this._sourceDataItems.length === 0);
            }
        },
        onLoadMoreItemsRequested: function(args, LoadOnDemandListViewEventData)
        {
            const that = new WeakRef(this);
            const listView = args.object;
            if (this._sourceDataItems.length > 0) {
                setTimeout(function () {
                    that.get().addMoreItemsFromSource(20, listView);
                }, 0);
                args.returnValue = true;
            }
            else {
                args.returnValue = false;
                listView.notifyAppendItemsOnDemandFinished(0, true);
            }
        },

          });
          var searchedSkill = appSettings.getString("searchskill");
          var location = appSettings.getString("country");
          viewModel.set("searchResults", searchedSkill + ' in ' + location);
          // viewModel.set("locations", location);
          viewModel.set("isBusy", true);
          var url="https://adekunletestprojects.000webhostapp.com/skog/searchResults.php?search=" + encodeURIComponent(searchedSkill) + "&location=" + encodeURIComponent(location);
          fetch(url).then((response) => response.json()).then((res) => {
               viewModel.set("items", res.items);

                viewModel.set("isBusy", false);
               // viewModel.set("names", res.firstName[0].items);
           }).catch((err) => {

          });

          return viewModel;
        }

    module.exports = SearchViewModel;

1 Ответ

1 голос
/ 02 мая 2020 
const viewModel = observableModule.fromObject({
    _sourceDataItems: [],
    addMoreItemsFromSource: function (chunkSize)
    {
        _sourceDataItems= new ObservableArray();
        var newItems = this._sourceDataItems.splice(0, chunkSize);
        this.items.push(newItems);
    },
    onLoadMoreItemsRequested: function (args)
    {
        console.log("---load item called----");
      const that = new WeakRef(this);
      const listView = args.object;
      if (this._sourceDataItems.length > 0) {
        setTimeout(function () {
          that.get().addMoreItemsFromSource(2);
          listView.notifyLoadOnDemandFinished();
        }, 1500);
        args.returnValue = true;
      } else {
        args.returnValue = false;
        listView.notifyLoadOnDemandFinished(true);
      }
    },
...