v-module绑定vuex里面的数据
当在严格模式中使用 Vuex 时,在属于 Vuex 的 state 上使用 v-model 会比较棘手:
<input v-model="obj.message">
假设这里的 obj 是在计算属性中返回的一个属于 Vuex store 的对象,在用户输入时, v-model 会试图直接修改 obj.message 。在严格模式中,由于这个修改不是在 mutation 函数中执行的, 这里会抛出一个错误。
用“Vuex 的思维”去解决这个问题的方法是:给 <input> 中绑定 value,然后侦听 input 或者 change 事件,在事件回调中调用 action:
<input :value="message" @input="updateMessage">
computed: {
...mapState({
message: state => state.obj.message
})
},
methods: {
updateMessage (e) {
this.$store.commit('updateMessage', e.target.value)
}
}
下面是 mutation 函数:
mutations: {
updateMessage (state, message) {
state.obj.message = message
}
}
v-module绑定vuex里面的数据的更多相关文章
- TreeView树形控件递归绑定数据库里的数据
TreeView树形控件递归绑定数据库里的数据. 第一种:性能不好 第一步:数据库中查出来的表,字段名分别为UNAME(显示名称),DID(关联数据),UTYPE(类型) 第二步:前台代码 <% ...
- Windows Phone 8初学者开发—第14部分:在运行时绑定到真实的数据
原文 Windows Phone 8初学者开发—第14部分:在运行时绑定到真实的数据 第14部分:在运行时绑定到真实的数据 原文地址: http://channel9.msdn.com/Series/ ...
- vs 2015 rdlc报表绑定datagridview中的数据
这几天一直想要实现rdlc报表绑定datagridview中的数据,始终在虚拟表向rdlc报表绑定这一步上出错.今天从下午4点到七点四十一直在尝试.最终还是实现了,最然并不知所以然,这个问题还是以后在 ...
- 在function module 中向数据库插入数据
http://www.sapjx.com/abap-function-module.html 1: 应该在function module 中向数据库插入数据
- 用Vue来实现音乐播放器(四十):歌单详情页布局以及Vuex实现路由数据通讯
1.歌单详情页是推荐页面的二级路由页面 将推荐页面歌单的数据传到歌曲详情页面 利用vuex 1.首先在state下定义一个歌单对象 disc{} 2.在mutaions-types中 定义一个别名 ...
- JavaScript 绑定事件时传递数据
var data = { name: 'Ruchee', email: 'my@ruchee.com' }; data.handleEvent = function (e) { console.log ...
- 使用vuex来管理数据
最近一直工作比较忙,博客已经鸽了好久了,趁着今天是周末,写点东西吧 使用vuex来管理数据 最近一直在用vue做项目,但是却从来没真正去用过vuex,因为一直感觉很复杂,其实真正去研究一下啊,就会发现 ...
- vuex commit保存数据技巧
vuex 单向数据流,推荐的commit 改变state数据,写起来非常繁琐,因为改数据可能要写很多commit函数. 依据我的理解,单向数据流主要是为了避免数据混乱,便于调试. 说白了,就是一个数据 ...
- vue3-组件中使用setup函数获取vuex中的数据的新方式
传统方式 setup() { const store = useStore() //传统方式 const aName = computed(() => store.state.name) ret ...
随机推荐
- smartProgram学习笔记
背景:转正前要完成这样一个编程课的学习.平时写代码只是完成基本的功能,没有养成良好的习惯,感觉这样的课程还是要好好学习下,要不真是不知道什么叫写代码. Week1 为什么要写好代码? 因为平时读:写代 ...
- Java 数组+循环升级篇
数组是一个变量,存储相同数据类型的一组数据(就是能存储很多数值的数据类型) 如果说声明一个变量就是在内存空间划出一块合适的空间,那么声明一个数组就是在内存空间划出一串连续的空间. 数组的基本要求 标识 ...
- VMware加载vmdk文件
VMware软件文件菜单选择---映射虚拟磁盘选项,如图1所示
- 斯坦福大学公开课机器学习: advice for applying machine learning | regularization and bais/variance(机器学习中方差和偏差如何相互影响、以及和算法的正则化之间的相互关系)
算法正则化可以有效地防止过拟合, 但正则化跟算法的偏差和方差又有什么关系呢?下面主要讨论一下方差和偏差两者之间是如何相互影响的.以及和算法的正则化之间的相互关系 假如我们要对高阶的多项式进行拟合,为了 ...
- Failed to resolve: com.android.support:appcompat-v7:28 问题解决
apply plugin: 'com.android.application' android { compileSdkVersion buildToolsVersion "28.0.2&q ...
- (叉乘求面积) nyoj1011-So Easy[II]
1011-So Easy[II] 内存限制:64MB 时间限制:1000ms 特判: No通过数:2 提交数:4 难度:2 题目描述: 这是一道基础的计算几何问题(其实这不提示大家也都看的出).问题描 ...
- maven编译或者打包web项目显示“软件包 javax.servlet.http 不存在"
2.解决办法: 这是由于缺少servlet-api.jar包,其实tomcat下有,但是在java build path把他加载过来,还是报这个错误,所以我们直接在pom.xml里面加入这个jar包即 ...
- jenkins 基本配置
修改jenkins使用用户和启动端口 //yum 安装 cat /etc/sysconfig/jenkins 安装完后安装maven插件 设置jenkins项目存放目录 系统管理---->系统设 ...
- awk 处理文本:行转列,列转行
[root@centos ~]# cat f 1 2 3 4 5 1 2 3 4 5 1 2 3 4 5 1 2 3 4 51 2 3 4 5 awk '{for(i=1;i<=NF;i++)a ...
- Spring JPA学习笔记
目录 什么是JPA? 引入配置 新建一个Entity Bean类 JPA的增删改查 新建操作接口 新建测试类 总结 什么是JPA? 什么是JDBC知道吧?数据库有Mysql,SQL Server,Or ...