Vue/vuex wyciąganie danych z tablicy

Question

Witam! Tworzę projekt w VUE i mam następujący problem. W Vuexie przechowuję dane takie jak JWT Token czy dane na temat Usera. Gdy próbuję wybrać te dane w taki sposób 

{{$store.getters.user['name']}}

to dostaję error: Uncaught TypeError: Cannot read property 'name' of undefined

A co najśmieszniejsze to nazwa użytkownika wyświetla się poprawnie, a kiedy wyświetlam całą tablicę

{{$store.getters.user}}

to wyświetla się ona poprawnie i bez żadnych błędów. Czy ktoś może wie o co tu chodzi?

Answer 1

a spróbuj tak ;) 

{{$store.getters?.user?.name}}

Wydaje mi się że twój problem może polegać na tym że przy starcie aplikacji nie masz tych danych w state. A dostajesz je dopiero później.  Jednak gdy w pierwszym renderowaniu aplikacja się wywali to drugi render nie przejdzie ;) 

Pomocna mogło by się okazać stworzenie startowego state z wszystkimi kluczami i przypisaniem tam np. pustych stringów ;) 

Comments

Spoko, wypróbuję w domu, ale byłbym wdzięczny gdybyś wyjaśnił czym się różni ten twój zapis ze znakami zapytania od mojego.

---

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining

W skrócie chodzi o to 

 

var someA = undefined; 

console.log(someA.someKey.otherKey); // Uncaught TypeError: Cannot read property 'someKey' of undefined

var someB = undefined; 

console.log(someB?.someKey?.otherKey); // undefined