关于VUE中VUEX数据监听问题

148 阅读1分钟

刚开始的时候以为这样赋值在视图监听中就能获取数据,其实是不行的,如果直接赋值,他只是简单的进行了赋值运算,别的地方不知道,就比如视图中就不知道,无法响应

                    if (alarmInfo.guid == currentAlarmVar[index].guid) {

                      console.log(currentAlarmVar[index].recordState);

                      console.log(alarmInfo.recordState);

                      console.log("替换" + index);

                      currentAlarmVar[index] = alarmInfo;

                      console.log(currentAlarmVar[index].recordState);

                      this.$store.commit(

                        "set_currentAlarmVar",

                        currentAlarmVar
                        );

                      break;

                    }


应该用$set来赋值这个方法,相当于执行了赋值的函数,用到了重载,大家应该很多人都没学过C++,就不细说了。

if (alarmInfo.guid == currentAlarmVar[index].guid) {


 console.log(currentAlarmVar[index].recordState);

                      console.log(alarmInfo.recordState);

                      console.log("替换" + index);

                      //currentAlarmVar[index] = alarmInfo;

                      // set会有一个 definedReactive 的过程,视图监听会响应

                      this.$set(currentAlarmVar, index, alarmInfo);

                      console.log(currentAlarmVar[index].recordState);

                      this.$store.commit(

                        "set_currentAlarmVar",

                        currentAlarmVar

                      );

                      break;

                    }

用这个方法,就会监听到了