Vue Dev Tools 检测到 Vuex 状态突变 - 组件无法检测到变化答案

【问题标题】：Vuex state mutation detected by Vue Dev Tools - component fails to detect changeVue Dev Tools 检测到 Vuex 状态突变 - 组件无法检测到变化
【发布时间】：2023-04-11 07:04:01
【问题描述】：

mutations: {
    //turns sets values to false/off based on area
    updateGroup(state, { newCodes, areaId}) {
        //area is the codes to change only 
       let area = state.details.find(el => el.id === areaId).markers
       let turnOn = {}
       let turnOff = {}
       for(let i = 0; i < area.length; i++) {
           if(newCodes.hasOwnProperty(area[i])) {
               turnOn[area[i]] = area[i]
           } else {
               turnOff[area[i]] = area[i]
           }
       }

       for(let i = 0; i < state.semaforos.length; i++) {
           if(state.semaforos[i].id == turnOn[state.semaforos[i].id]) {
            Vue.set(state.semaforos[i], 'kode', newCodes[state.semaforos[i].id])
           }
           if(state.semaforos[i].id == turnOff[state.semaforos[i].id])
           Vue.set(state.semaforos[i], 'kode', 'off')
       }







    }
}


methods: {
          update(payload) {
          this.$store.commit('updateGroup', payload)
      },
        },

在我调用提交的组件中，我拉入状态

computed : {
      ...mapState({
        mapArea(state){
          return state.semaforos
        }
      })
    },

我现在设法从 mapState 获得反应值现在的问题是它在其他组件中没有这样做

提前感谢您提供的任何帮助。祝你有美好的一天！。编辑：这里是要求的吸气剂

getters: {
    getChange: state => {
        return state.semaforos
    }
},

和状态定义注意：我用 ?? 替换了实际坐标为了隐私=）

state: {
    semaforos: [
         { id : 'V2',   location: [??], kode : 'off'}, 
         { id : 'P2',   location: [??], kode : 'off'},
         { id : 'V3',   location: [??], kode : 'off'},                 
         { id : 'P3',   location: [??], kode : 'off'},
         { id : 'V4',   location: [??], kode : 'off'}, 
         { id : 'P4',   location: [??], kode : 'off'},
         { id : 'V5',   location: [??], kode : 'off'},        
         { id : 'P5',   location: [??], kode : 'off'},
         { id : 'V6',   location: [??], kode : 'off'}, 
         { id : 'P6',  location: [??], kode : 'off'},
         { id : 'V7',   location: [??], kode : 'off'}, 
         { id : 'P7',   location: [??], kode : 'off'},
         { id : 'V8',   location: [??], kode : 'off'}, 
         { id : 'P8',   location: [??], kode : 'off'},
         { id : 'V9',   location: [??], kode : 'off'}, 
         { id : 'P9',   location: [??], kode : 'off'},
         { id : 'V10',   location: [??], kode : 'off'}, 
         { id : 'P10',   location: [??], kode : 'off'},
         { id : 'V11',  location: [??], kode : 'off'}, 
         { id : 'P11',  location: [??], kode : 'off'},
         { id : 'V12',  location: [??], kode : 'off'}, 
         { id : 'P12',  location: [??], kode : 'off'},
         { id : 'V13',  location: [??], kode : 'off'}, 
         { id : 'P13',  location: [??], kode : 'off'},
         { id : 'V14',  location: [??], kode : 'off'}, 
         { id : 'P14',  location: [??], kode : 'off'},
         { id : 'V1',  location: [??], kode : 'off'}, 
         { id : 'P1',  location: [??], kode : 'off'},
    ]
},

【问题讨论】：

你能把你的getter列表贴出来吗？
请添加状态定义
你的状态没有意义？它通常由像数组这样的键值和单个键和值组成。
你可以在 objs 数组中拥有状态？
这是因为我需要根据对象的 ID 访问对象。让我看看我是否可以对其进行重组并使其成为这样。你的意思是对的吗？ ID03: [ { kode : 'off', location: [??], iD : 'V12', alive: false}, {...}, {...}, {...}]

标签： vue.js state vuex

【解决方案1】：

该问题与 mapState 或 vuex 完全无关。由于我使用的是 laravel-echo-server，问题是我从 linux 命令行发送代码，并且只能在监听特定频道时访问该数据（我只在一个组件 mapState 上监听该频道实际工作...）。这就是我的其他组件无法访问该特定通道上的数据的问题，因此无法接收更新（或使用新数据提交更改，从而反映存储上的更改）。感谢大家的指点，祝大家好日子！

【讨论】：