vuex数据与组件内表单实现v-model 实时同步

刚学习vuex 遇到了一个问题 正常的导出表单绑定的数据 在组件接收
在输入表单的时候报错
报:
Computed property “xxx“ was assigned to but it has no setter.

简单翻译了一下,是没有set方法,因为vuex中是单项流,v-model是vue中的双向绑定,但是在computed中只通过get获取参数值,没有set无法改变参数值,

所以查阅了资料后

我添加了set方法

大家可以做一下参考

// 注意修改数据

// 解释一下数据 
// input 是vuex 的 state 内的公共数据 在使用之前已经导入该组件


 // vuex内的方法
 // 同步数据
    changInput(state, val) {
      state.input = val;
    },
// computed 中的属性
input: {
      get() {
        return this.$store.state.input
      },
      set(val) {
      // 把修改的值 使用get 传参 传给了vuex内的一个方法 二这个方法则是同步数据 跟set的val值互相对应  每次修改都会触发  相当于实时数据了
        this.$store.commit('changInput', val)
      }

前端小白 初习之,若有误导,还请指正~

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值