Cannot iterate through components in new list view

App Building
1

I'm struggling with the "New" list view after using the old version successfully for a while.

We have editable fields in the containers of the list view. The idea is to have a variable number of input. In the case I'm working on, it is just two numbers.

However, it is important we can add and delete from this list, and of course we need to keep the visuals in sync with our representative data. This doesn't seem possible.

#1 Problem:
I cannot find a way to iterate through the controls of the listview and get all of the values. Using listview.data gives us the data source, which does not match the current values in the controls. In the old list view, we could access the controls in the list as an array: numberInput[i].value would give us the value in the control of the ith item in the list view. This doesn't seem to work with new list view.

#2 Problem.
There seem to be some caching and reusing of controls that leads to the wrong default values. For example, if I delete an item from the data source, the list view updates and I can get it to update properly (with some struggles). However, if I then add a new entry to the data source, a new container is added to the end with whatever data was in the previously deleted item, which does not match the data source! I cannot get newly added items to display correct values consistently.

2

Hi @Garr_Godfrey! Thank you for the feedback.

Re: #1 Problem -- this is a known limitation at this time. We're currently working on an aggregation solution that we hope improves this experience for you.

Re: #2 Problem -- Are you using Primary Keys? If so, what do those look like?

1 Like
3

I reverted to use Legacy List View. New List View didn't seem ready.

I believe I did not have primary keys. The list was for a simple array:

[
{limit: number; time: number},
...
]

so I didn't have something to use as a key. From the document (read from db), I cloned this array to a variable so it could be kept up to date. When adding a new entry, it just appends {limit: 0, time: 0} to the end of the array.

I got different results setting default value to {{ item.limit }} than if I did {{ listView1.data[i].limit}} or {{ customarray.value?.[i].limit }}. Even though they should all be the same thing, using item.limit was the most problematic and when deleting from array, it would only ever remove the last set of controls and all of the values displayed would be wrong.

4

anyway, I can see how having a KEY can make this more performant. Might just need to generate random unique identifiers in cases like this.

5

I tested and adding a key: uuid.v4() to each record in array, and using {{ item.key }} as the key for the table seemed to resolve the issues.

1 Like