[Vuejs]-Vuex getters used in a component show errors in console because at the time of their calling, the Vuex state properties are still null

by

0👍

Two options come to mind.

  1. Set the default state value to something other than null. So for this error:

TypeError: Cannot convert undefined or null to object

Try setting the default value of that state to {}.

  1. Add a check somewhere that the state value is what you expect before you try to use it.

So for example in your findChampion function you can check the state value first like:

findChampion: (state) => (id) => {
     if (!state.champions) {
         return []; // or whatever is appropriate to return
     }

     let championId = id.toString();
     let champion = Object.values(state.champions).find(value => value.key === championId);

     return champion
 }

0👍

I think you need to check with state.champions exists before. Something like this:

findChampion: (state) => (id) => {
  let championId = id.toString()
  let champion = state.champions ? Object.values(state.champions).find(value => value.key === championId) : []
  return champion
}

: [] return a empty array, you can return null, false, undefined or any other thing you need.

Check if this works please, and tell me.

Leave a comment