天天看点

vuex:父组件修改了state不更新子组件的原因

检查vuex有没有使用模块化

之前我预定义的store没有考虑到模块化,后来增加了模块化导致子组件不更新了。(当然也要使用命名空间)

分析

分析了父组件之前编写的源码之后,发现是直接使用的mapState导入的state,这里就导致子组件接收到的props实际上只是store的直接子元素,所以子组件收到的props为undefined。

解决办法

重写一下mapState函数就行了。我们可以使用vuex给我们提供的createNamespacedHelpers(),参数是子模块的路径

store/index.js

export default new Vuex.Store({
    modules:{
      data:{
        namespaced:true,
        state:data,
        mutations:dataMutations,
        actions:dataActions,
        getters:{

        }
      },
      status:{
        namespaced:true,
        state:status
      }
    }
})

           

继续阅读