Working with `List View` component

Help & Support 💻
1

Hello,

I’m trying to set up a component that lets me display multiple items, add items, remove items and modify items, pretty simple stuff. I thought of making it using a List View, so I started testing with that.
I added the component to the page and without changing anything tried to run an action which only does:

return {{ui.listView.value}}

And the result is… just [{},{},{},{},{},{}] an array of empty objects… What?

Maybe there’s something wrong in the settings, or I’m not asking for the right thing, I thought, but no, nothing I tried actually returned the values of the items. So I checked out the documentation for the List view and the very similar Grid view and in the docs for Grid view there was an example that shows how to set/get values. But it doesn’t do it with the properties ui.gridView.value and ui.gridView.setValue, but instead with an extra State variable.

If it is intended that the List view and Grid view are used like that, with a State variable, why do they have ui.<component>.value and ui.<component>.setValue?

On the other hand, these components are similar to the Accordion component, which has no issues with getting/setting the value.

2

Hi @Max

Sorry about that! I will clarify it with the dev team and get back to you later.

Cheers!

1 Like
3

Hi @Max

ui.list.value contains data from the inputs added to the ListView, not the data used to render the ListView.

Therefore, you need to use either a state variable or an action and manipulate the data within the action or variable.

Hope this helps!

1 Like
4

Hi @Kate,

I see how it is. Since the List view is under the Structure category, I thought the component is more of a pure display type. But it does make sense to do it that way.

Thank you for checking :slight_smile:

1 Like