我同时使用vuex和vuejs 2。

我是vuex的新手,我想看一个商店变量的变化。

我想在我的vue组件中添加手表功能

这是我目前所拥有的:

import Vue from 'vue';
import {
  MY_STATE,
} from './../../mutation-types';

export default {
  [MY_STATE](state, token) {
    state.my_state = token;
  },
};

我想知道my_state是否有任何变化

我怎么看店。My_state在我的vuejs组件?


当前回答

你也可以使用debouncedWatch (vue使用函数)安全地观看它

  debouncedWatch(
    lines,
    () => {
      console.log('changed');
    },
    500,
  );

其他回答

你也可以订阅商店突变:

store.subscribe((mutation, state) => {
  console.log(mutation.type)
  console.log(mutation.payload)
})

https://vuex.vuejs.org/api/#subscribe

您还可以在vue组件中使用mapState来直接从存储中获取状态。

在你的组件中:

computed: mapState([
  'my_state'
])

其中my_state是存储中的变量。

Vue手表处于字符串状态

状态:

$store.state.local_store.list_of_data

内部组件

  watch: {
       
       '$store.state.local_store.list_of_data':{//<----------your state call in string
        handler(){
            console.log("value changeing in party sales entry"); //<---do your stuff here
        },
        deep:true
       }

    },

我使用的一个非常简单的计算方法是这样的。也许这对你有帮助。

  const variable_name = computed(
        () => store.state.[name_of_state].property_name
      );

你可以这样做的另一个版本是

computed: {
  name () {
    return this.$store.state.[name_of_state].property
  }
}

这是从存储中访问getter的一种格式。 希望你今天过得愉快。

在组件内部,创建一个计算函数

computed:{
  myState:function(){
    return this.$store.state.my_state; // return the state value in `my_state`
  }
}

现在可以观察计算出的函数名,比如

watch:{
  myState:function(newVal,oldVal){
    // this function will trigger when ever the value of `my_state` changes
  }
}

在vuex状态my_state中所做的更改将反映在计算函数myState中,并触发手表函数。

如果状态my_state包含嵌套数据,则处理程序选项将提供更多帮助

watch:{
  myState:{
    handler:function(newVal,oldVal){
      // this function will trigger when ever the value of `my_state` changes
    },
    deep:true
  }
}

这将监视my_state存储中的所有嵌套值。