I grab two sets of balances from my vuex state and merge them into a new array of entries. why is an error thrown when i iterate over my copies of the vuex state? am i missing something?

.filter() returns a new array, so coins is not connected to the $state any more.

I'm not mutating the vuex state, but my copies of it. still i'm warned to not mutate vuex store outside of mutations.

this would make sense, if those assignments were actual references to the vuex store, but they're not (or are they??). I've tried to understand what's wrong here, but i can't understand what's wrong here. i hope you guys can help. thanks!

filteredItems() {
      let coins = this.$store.state.wallet.balances.filter(( item ) => this.getCoinPropertiesByTicker(item.ticker).staking_available);
      const stakingCoins = this.$store.state.wallet.stakingBalances;
->    coins.forEach((coin) => {     // error happening here
        const stakingCoin = stakingCoins.user.stats.find((name) => name.ticker === coin.ticker)
        if (stakingCoin) {
          coin.totalAmount = {
            amt: new BigNumber(stakingCoin.balance).decimalPlaces(8).toString(),
            usd: new BigNumber(stakingCoin.balance_usd).decimalPlaces(2).toString()
          }
        }
      return coins
      }



[Vue warn]: Error in callback for watcher "function () { return this._data.$$state }": "Error: [vuex] do not mutate vuex store state outside mutation handlers."

(found in <Root>)


vue.esm.js?a026:1897 Error: [vuex] do not mutate vuex store state outside mutation handlers.
    at assert (vuex.esm.js?2f62:90)
    at Vue.store._vm.$watch.deep (vuex.esm.js?2f62:793)
    at Watcher.run (vue.esm.js?a026:4577)
    at Watcher.update (vue.esm.js?a026:4551)
    at Dep.notify (vue.esm.js?a026:739)
    at Object.reactiveSetter [as amountStaked30] (vue.esm.js?a026:1064)
    at eval (Staking.vue?3a4a:134)
    at Array.forEach (<anonymous>)
    at VueComponent.filteredItems (Staking.vue?3a4a:115)
    at Watcher.get (vue.esm.js?a026:4488)