我来自 React 背景,它足以从 prop 设置你的状态,你可以调用 setState({...})
更新状态,所以,使用 vue/vuex,我觉得很难。
简化:
Vuex 状态
name: "Foo bar"
Vuex Action
addName
我可以毫无问题地更改状态,但我需要绑定(bind)一个输入字段,并且在更改时更新状态。将此视为更新表单,其中已预先填写用户详细信息并且他们可以更改自己的姓名。
<input @change="addName(newName) v-model="newName" />
我可以添加 watch
关注newName
并更新状态但是,我需要用状态预先填充输入。哈!我可以使用 beforeMount()
但是我的状态还没有加载。
computed: {
...mapState([
'name'
]),
},
beforeMount() {
// this.newName = this.name
console.log('Mounted') // Shows in console
console.log(this.name) // nothing
}
名称显示在模板中 <pre>{{ name }}</pre>
最佳答案
你可以使用 computed setter
computed:{
name:{
get: function(){
return store.state.name;
},
set: function(newName){
store.dispatch('addName',newName);
}
}
}
enter code here
并设置v-model
到计算属性 name
在你的<input>
标签:
<input v-model="name" />
这是工作 jsfiddle
关于vue.js - 如何绑定(bind)输入字段并同时更新 vuex 状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44456528/