vuex：vuex取值undefined、vue监听器、以及监听失效（数据没有改变的问题）

深碍√TFBOYSˉ_ 2022-10-05 14:53 398阅读 0赞

### 一、vuex取值undefined ###

网上很多都是直接取值的：this.$store.state.全局变量名称

但是具体问题具体分析嘛！看看vuex里面是怎么定义的

![20210609183628780.png][]

原来这个参数用了getters

那我们就懂了  this.$store.getters.全局变量名称 才是***正确的***

### 二、vue监听器 ###

先贴代码吧，为我还不能肯定这个能用

结论：可用

但是这里注意：监听方法只有vuex数据发生改变是才会被触发

import { mapGetters } from 'vuex'
      export default {
        name: "",
        computed: {
          ...mapGetters([
            'officialInfoList',
          ]),
          officialInfoWatch(){
            console.log("测试vuex");
            console.log(this.officialInfoList);
            return this.officialInfoList;
            //return this.$store.getters.officialInfoList;
          },
        },
        watch:{
          officialInfoWatch(officialInfo){
            console.log("当前list");
            console.log(officialInfo.list);
          }
        },
       }

### 三、监听失效（数据没有改变的问题） ###

如二中的代码，初始化页面是会出现两种情况

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzE2OTQ2ODAz_size_16_color_FFFFFF_t_70][]

\------------------------------------------------------------------------------------

![20210610095213121.png][]

然后我们得出结论：watch监听器只有数据发生改变是才会被触发

[20210609183628780.png]: /images/20221005/6229070b2ba441f6abcf91ffc6675d60.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzE2OTQ2ODAz_size_16_color_FFFFFF_t_70]: /images/20221005/f3932d74a185414d990d263707b3fe0c.png
[20210610095213121.png]: /images/20221005/d4ad0af77be24925870fbc67e6a9d9b0.png