Vue中使用v-model实现表单元素数据双向绑定到组件中data中的变量。最近在开发naive-desktop-translator时,遇到一个需求,需要把表单元素直接通过v-model绑定到vuex中的state值上。在网上搜索后,参考这篇博客的解决方案,先使用v-model绑定到组件内的一个computed计算属性上,再通过自定义该计算属性的getset方法,对vuex中的状态变量进行读取、写入操作。模板代码如下:

该模板文件代码:

 

其他的参考:

vuex文档:https://vuex.vuejs.org/zh/

vue文档中计算属性的getter与setter部分:https://cn.vuejs.org/v2/guide/computed.html#计算属性的-setter

分类: Vue

0 条评论

发表评论

电子邮件地址不会被公开。 必填项已用*标注