vuex计算的属性不是被动的

时间:2018-02-15 07:48:50

标签: vue.js vuex

test.vue,'test'属性在vue组件中是反应性的,但是当我更改第一个输入标签的值时,来自vuex store的'title'属性不会被激活。我发现了一些类似的问题,但解决方案对我不起作用。我在哪里做错了?

模板

<div class="title">
  <input 
    type="text" 
    placeholder="palceholder" 
    v-model="title"
   />
</div>
<input v-model="test"/>
<div>{{test}}</div>
<div>
  {{title}}
</div>

JS

data() {
  test: 'test'
},
computed: {
  ...mapGetters(['article']),
  title: {
    get () { 
       return this.article.title || '' 
    },
    set (value) { this.$store.commit(Types.UPDATE_TITLE, value) }
  }
}

store.js

import * as Types from '../mutation-types'
import Vue from 'vue'
const state = {
  article: {}
}

const getters = {
  article: state => state.article
}

const mutations = {
  [Types.UPDATE_TITLE] (state, title) {
    state.article = { ...state.article, title }
  }
}

0 个答案:

没有答案