多頻道系列就會用到前面所講的一堆東西，然後因為資料存放改放到store，所以有部分扣已經跟之前有點不一樣，變成以用store資料為準，內容可能就會漏掉一些getState getMutation之類的東東

做多個聊天室，打算把資料都存到store，今天就先處理store這塊

Vuex新增channel的資料

原本有loginData，先增加channels的資料

export const state = () => ({
  loginData: {
    memberName: null,
    memberId: null
  },
  channels: {
    now: null, // 記當前頻道
    list: {} // 頻道列表
  }
})

channel的資料資料有

{
    name: '聊天室名稱',
    channelId: '',
    members: [],
    msg: []
}

原本在頁面上的資料有部份就要刪掉，改從store去取

Mutation新增兩個，一個新增channel用，一個設定目前channel

SET_CHANNEL: (state, data) => {
    Vue.set(state.channels.list, data.channelId, data)
    if (!state.channels.now) {
      state.channels.now = data // 如果當前頻道是空的，就一起設定
    }
},
SET_NOW_CHANNEL: (state, data) => {
    state.channels.now = data
},

這裡會用到Vue.set，基本上是在做

state.channels.list[channelId] = data

不過因為在object新增key的時候不會被響應系統察覺，Vue沒有因為資料更改而去更新畫面，這時候就要用Vue.set（在store這樣用，而且要記得import vue)

在一般page頁，直接用this.$set

Vue.set(target, newKey ,data) // (要更改的資料,新的key,key要存的資料)

this.$set(target, newKey ,data) 

說個笑話，我以前不知道key是在講哪個東西ＸＤ
{key: 'aaa',key2: 'bbb'}就是那個key(啥)

另外還有陣列，陣列更改要被響應系統偵測到，就必須用push,pop,shift...這類的函式來更改，直接寫arr[0] = 'abc'，是不會更新畫面的

我已經沒梗了我快瘋囉我要在最後幾天斷賽囉我每天都不想寫文囉