All of a sudden, ListView.refresh() no longer updates the display of the items in the list. I have verified that it has stopped working on previous projects which have been tested and committed. This occurs on both Android and iOS, and on all devices and emulators.
I've done the usual - done an ns clean, rebooted the machine, stated with fresh emulators, and I cannot get any refresh() to work. I've stepped through the refresh() source code in the debugger, and no errors occur, but then this code hasn't changed either.
This is a NativeScript 8 JavaScript project. This problem appeared when using nativescript-ui-listview 10.0.2. The problem persists with version 10.2.8, which is the latest.
I'm at a loss for where to even start. It would appear to be related to my system since prior working code now fails (no error, the list display just remains unchanged). Since it occurs on Android, I presume it's not an Xcode issue.
I'm looking for a lifeline here. Any ideas on what might be going on?
Edit Sep 12, 2022:
I created a fresh Hello World javascript project and added a simple RadListView:
<lv:RadListView id="testview" items="{{ items }}" >
<lv:RadListView.itemTemplate>
<GridLayout columns="2*,*">
<Label col="0" class="mx-16-8 my-0-0" style="font-size: 16" text="{{ name }}" />
<Label col="1" class="mx-8-16 my-0-0" style="font-size: 16" text="{{ count }}" />
</GridLayout>
</lv:RadListView.itemTemplate>
</lv:RadListView>
<Button text="Update" tap="onUpdateTap" />
With the associated code:
viewModel.items = [
{name: "David", count: 8},
{name: "Penny", count: 6},
{name: "Kumar", count: 3},
]
export function onUpdateTap(args) {
let button = args.object;
let page = button.page;
let viewModel = page.bindingContext;
let listview = page.getViewById("testview");
viewModel.items[1].count++;
listview.refresh();
}
This works correctly: the Update button increments the second count and the display is refreshed.
I then added this same code to my working project. It works on iOS devices and emulators but fails on Android devices and emulators. Again, no exceptions, errors, or messages, the display just fails to refresh. This is the only problem isolation I've been able to achieve so far.
I've spent about a day stepping through the ListView.refresh() code in a debugger, but that hasn't yet yielded any paths to pursue. I can see there are three events that are triggered:
dataPopulated
itemLoadingInternal
itemLoading
But, I can't see where those events are handled. Where it works (sample code on iOS), I can see that refresh() returns control before the display is updated. Where it doesn't work, control is returned but there's no update. Otherwise, I can't find any differences between the two flows.
I'm still looking for pointers and hope this additional info will help.
Edit Sep 13, 2022:
On the recommendation from the discord community, I'm looking at using an ObservableArray rather than a simple Array, as that seems better suited for RadListView. But, even this simple code fails to refresh on Android (it works on iOS):
<lv:RadListView items="{{ rlvItems }}" >
<lv:RadListView.itemTemplate>
<GridLayout columns="2*,*">
<Label col="0" class="mx-16-8 my-0-0" style="font-size: 16" text="{{ name }}" />
<Label col="1" class="mx-8-16 my-0-0" style="font-size: 16" text="{{ count }}" />
</GridLayout>
</lv:RadListView.itemTemplate>
</lv:RadListView>
viewModel.rlvItems = new ObservableArray(
{name: "David", count: 8},
{name: "Penny", count: 6},
{name: "Kumar", count: 3}
);
let item = viewModel.rlvItems.getItem(1);
item.count++;
viewModel.rlvItems.setItem(1,item);
I'm concluding that something in my project must be interfering with the value changed notification process; I don't think there's anything wrong with this code or the underlying NativeScript/RadListView code.
I still welcome pointers on what to pursue here.