forEach is not working for items structure of data from store of ExtReact

Question

I am trying to iterate through data of ExtReact store to get the data from the store using .getData().

Subsequently, when I try to iterate through the items, I don't get any results for a single item. It's like it is empty.

Here is the result of data.items when I console.log the whole array:

However, when I go through this array using forEach I am getting nothing.

This is the code of forEach loop:

if(userShortCutData.items !== undefined){
    console.log(userShortCutData.items);
    userShortCutData.items.forEach(function(item){
        console.log(item); //nothing is consol.log-ed;
        console.log(item.data); //nothing is consol.log-ed;
        console.log(item._user); //nothing is consol.log-ed;
    });
}

Does it log undefined? Or does it just not log anything as if the forEach is never run? — evolutionxbox, Apr 16 '18 at 09:57
Add another condition in `if` like `userShortCutData.items.length` — Mamun, Apr 16 '18 at 09:58
It's likely that the console log is showing you an "evaluated just now" object, but when the code is run `items.length` is likely to be `0`. — evolutionxbox, Apr 16 '18 at 10:00
Ok when I write if condition: if(userShortCutData.items !== undefined && userShortCutData.items.length !== 0) it doesn't even enters the if condition.. Any other ideas? I will try answer below in more details... — Милош Рајковић, Apr 16 '18 at 11:13

Evan Trimboli · Accepted Answer · 2018-04-16T11:09:40.187

3

To get the underlying list of records as an array:

store.getRange().forEach(r => {
    console.log(r.id);
});

To use the built in store method:

store.each(r => {
    console.log(r.id);
});

You can use a load or refresh listener (depending on what you need) on the store to wait until data has been processed:

store.on('refresh', () => {
    // do the magic();
});

edited Apr 16 '18 at 11:09

answered Apr 16 '18 at 10:25

Evan Trimboli

29,900
6
45
66

1

How to access data inside store.on? Because inside that I can't use store.data.items right? – Милош Рајковић Apr 16 '18 at 10:57
The same way you do it outside, either by calling `getRange` or `each` or any other store function. – Evan Trimboli Apr 16 '18 at 10:59
1

Ok to do: store.on("refresh", () => { store.getData().getRange().... }); or? – Милош Рајковић Apr 16 '18 at 11:07
Don't use `getData` at all. Use `getRange` or `each` directly on the store. – Evan Trimboli Apr 16 '18 at 11:10
1

Aha ok, I will try that... :) – Милош Рајковић Apr 16 '18 at 11:11
What to use for map function? For rendering? Can you please add that to the post? – Милош Рајковић Apr 16 '18 at 12:20
`getRange()` returns the records as an array, as it says in the post. – Evan Trimboli Apr 16 '18 at 12:23
Can you please explain to me what is the difference between load and refresh? – Милош Рајковић Apr 16 '18 at 12:41
`refresh` :- Fires when the data cache has changed in a bulk manner (e.g., it has been sorted, filtered, etc.) and a widget that is using this Store as a Record cache should refresh its view. `load` :- Fires whenever the store reads data from a remote data source. For more details you can refer [doc](https://docs.sencha.com/extreact/6.5.0/modern/Ext.data.Store.html#event-load) – Narendra Jadhav Apr 16 '18 at 13:11
Is there some listener that I can use to load data from the store before first render? – Милош Рајковић Apr 16 '18 at 14:16
Your question doesn't make any sense. If you want to defer rendering until the store loads, then that's an entirely different question. You could check `store.getCount()` and render some loader as appropriate. – Evan Trimboli Apr 16 '18 at 14:25

forEach is not working for items structure of data from store of ExtReact

1 Answers1