Vue的2 + Vuex：在计算财产

Question

使用状态变量我有一对夫妇变量Vuex实例：

const store = new Vuex.Store({ 
    state: { 
    start_date: moment().startOf('year').format("MM/DD/YYYY"), 
    end_date: moment().format("MM/DD/YYYY") 
    }, 
    mutations: { 
    changeDate(state, date_obj) { 
     state.start_date = date_obj.start_date 
     state.end_date = date_obj.end_date 
    } 
    } 
}) 

，我有其中的日期属性是从store继承我的主要Vue的实例：

var employees = new Vue({ 
    el: '#employees', 
    computed: { 
    start_date() { 
     return store.state.start_date 
    }, 
    end_date() { 
     return store.state.end_date 
    }, 
    leads() { 
     let filter_obj = { 
     start_date: this.start_date, 
     end_date: this.end_date 
     } 
     return this.fetch('potential_clients', filter_obj) 
    } 
    }, 
    methods: { 
    fetch(model, args=null) { 
     return new Promise((resolve, reject) => { 
     console.log(resolve, reject) 
     let url = "/" + model + ".json" 
     console.log(url); 
     $.ajax({ 
      url: url, 
      data: args, 
      success: ((res) => { 
      console.log(res) 
      this[model] = res; 
      resolve(res) 
      }), 
      error: ((res) => { 
      reject(res) 
      }), 
      complete: (() => {}) 
     }) 
     }) 
    } 
    }, 
    mounted() { 
    this.fetch('potential_clients') 
    } 
}); 

和我最初叫this.fetch('potential_clients')没有任何多余的参数，但一次start_date和end_date值被改变，我想打电话给像上面leads()。但是，当我更改start_date和end_date的值时，没有任何变化。

值得一提的是，当我使用Vue插件在Chrome中进行检查时，单击根组件，突然显示视图中的更改？很奇怪

Answer 1

任何对Vue实例will not be reactive范围之外的变量的引用。这意味着您所引用的store对象不是被动的。

您需要参考的Vue实例的内部参考商店（this.$store），这是反应：

start_date() { 
    return this.$store.state.start_date 
}, 

这是假设你已经在你的根的配置对象传递的store Vue实例（在您的示例中，它似乎是#employees组件）：

var employees = new Vue({ 
    el: '#employees', 
    store: store, 
    ...