vue+vuex 修復數據更新頁面沒有渲染問題

不解：

為什么在關閉開關后，已經將data里的屬性和vuex屬性初始化后，頁面就是不響應？？？

問題：

由於切換路由后，獲取到vuex的數據在created中賦值到data相對應的屬性中，在關閉開關后請求接口將vuex和data里的屬性全部初始化，數據變更成功頁面不渲染。（接口只做請求，不做數據返回，由前端實現界面選擇回顯）

處理：computed + watch 在當前的頁面中監聽vuex中的數據變化，重新賦值給data里的屬性，使頁面渲染回初始化。

技術：vue，vuex

頁面元素：

1個開關switch，10個多選框數據

 

 

 

 

操作步驟：

1 進入頁面

2 全選數據后打開開關，請求接口

3 切換路由后將數據保存至vuex，當路由切換會當前頁時從vuex取出數據實現頁面的回顯

4 關閉開關，請求接口

代碼：

開關對應代碼

<el-switch
            v-model="fruitswitch"
            class="switchStyle"
            active-text="Yes"
            inactive-text="NO"
            :active-value="1"
            :inactive-value="0"
            @change="handleDebug"
          />
handleDebug(newV) {
      if (newV) {
        if (this.checkFruits.length === 0) {
          this.fruitswitch= 0;
          this.$message('請選擇水果！');
        } else {
          this.$store.dispatch('fruits/save_fruits', newV);
          !store.getters.fruits_switch && this.FruitsOpenSubmit();
          // 加入定時器代碼
          this.timerSet(1);
        }
      } else {
        this.FruitsSubmitClosed();
      }
    },

開關關閉：

FruitsSubmitClosed() {
 // 關 
submitInfo(this.submit_info) 
.then(res => { 
this.$store.dispatch('fruits/save_fruits', 0); 
this.checkFruits = []; 
this.checkAll = false; 
this.isIndeterminate = false; 
this.debugInfoSwitch = 0; 
this.$message.success(res.msg); 

})
 .catch(() => { 
this.$message.error('失敗！');
this.fruitswitch= 0; }); 

}