在vue1.0遇到vuex和v-model的坑
事情是这样的,在开发项目的过程中我使用了vuex并且在store中定义了一个保存用户信息的对象
userInfo : {
'nickName' : '', // 昵称
'password' :'', // 是否有密码
'gender' : '', // 性别
'avatar' : '', // 头像
'userAccount' : '', // 账号
'birthday' : '', // 出生日期
'cityName' : '', // 城市
'email' : '', // 邮箱
'mobile' : '', // 手机号
'userId' : '' // 用户id
}
然后在组件中也定义了一个一毛一样的对象完全一样,这样做是为了方便去store中用getter取值
this.userInfo = this.ache_getUserInfo;
现在我在这个组件中使用v-model绑定了 userInfo.nickName这个值,神奇的事情发生了,我input框输入值的时候,store里面的值也会随改变!
但是如果我的这个组件中的参数名和store中的不一样,就不会发生这种情况,比如我把nickName改为comNickName,然后在组件中绑定userInfo.comNickName就不会,也就是说组件中v-model绑定的值和vuex的store中的名字一样,那么他会影响store中的值。
=_=!!汗
在vue1.0遇到vuex和v-model的坑的更多相关文章
- tensorflow 2.0 技巧 | 自定义tf.keras.Model的坑
自定义tf.keras.Model需要注意的点 model.save() subclass Model 是不能直接save的,save成.h5,但是能够save_weights,或者save_form ...
- Vue1.0到2.0变化
一.生命周期 二.代码片段 在vue1.0中可以在template编写时出现: <template> <div>第一行</div> <div>第二行&l ...
- 【转】vue1.0与2.0的一些区别
一.生命周期钩子的差别 vue1.0的生命周期如下: vue2.0的生命周期如下: 用一张表格来做对比: 二.代码片段 在vue1.0中可以在template编写时出现: <template&g ...
- Vue1.0用法详解
Vue.js 不支持 IE8 及其以下版本,因为 Vue.js 使用了 IE8 不能实现的 ECMAScript 5 特性. 开发环境部署 可参考使用 vue+webpack. 基本用法 1 2 3 ...
- 使用vue1.0+es6+vue-cli+webpack+iview-ui+jQuery 撸一套高质量的后台管理系统
首先按照vue.js官网的指令安装: 1.本地安装好node.js 2.根据官方命令行工具 详情 这样一个官方的脚手架工具就已经搭建好了:但是有一点需要注意的是由于现在按照官方的搭建方法是搭建vue2 ...
- vue1.0和vue2.0的区别(一)
今天我们来说一说vue1.0和vue2.0的主要变化有哪些 一.在每个组件模板,不在支持片段代码 VUE1.0是: <template> <h3>我是组件</h3> ...
- vue1.0和vue2.0的区别(二)
这篇我们继续之前的vue1.0和vue2.0的区别(一)继续说 四.循环 学过vue的同学应该知道vue1.0是不能添加重复数据的,否则它会报错,想让它重复添加也不是不可以,不过需要定义别的东西 而v ...
- vue1.0中$index一直报错的解决办法
原文链接:https://www.cnblogs.com/liqiong-web/p/8144925.html 看学习视频,因为年份比较早了,其实vue早已迭代到vue2.0了,遇到一些问题: v-f ...
- vue1.0与vue2.0对于v-for的使用的区别
vue1.0与vue2.0对于v-for的使用的区别: 1,vue1.0中有$index,而vue2.0将$index移除. 2,vue1.0中(index,item) in list 而vue2.变 ...
随机推荐
- Tableview RefreashControl 下拉之后马上返回
Tableview RefreashControl 下拉之后马上返回 原因很简单: 我把 [self.tableView setContentInset:UIEdgeInsetsMake(0, 0, ...
- iPhone 6 屏幕揭秘
http://www.cocoachina.com/design/20141218/10680.html 一根线的渲染 为了说明多种设备的不同像素渲染情况,我们比较了一个一像素宽的线是怎样渲染的: 最 ...
- ICA和PCA
http://wenku.baidu.com/link?url=BsmIM7T4CU1D_MgiBzu4Ul1oLnM2Qpmc0sCfXIcD9S20qq3BEkSnuY4RUc7gDZoeFR1N ...
- Hyper-V安装Oracle Linux6_4 Oracle db 12c并使用rman做异机恢复
本文记录在Windows Server 2012 R2上安装Oracle Enterprise Linux 6.4以及使用RMAN进行进行异机恢复的过程. Windows服务器增加Hyper-V功能 ...
- IIS 发布 异常信息 AspNetInitClrHostFailureModule 的解决办法
昨天在一个客户那里使用Server 2008服务器配置IIS,都配置好之后竟然出现了错误信息,以前没有遇到过 "AspNetInitClrHostFailureModule",于是 ...
- Egit Patch
Git为我们提供了Patch功能,Patch中包含了源码更改的描述,能够应用于其他Eclipse工作空间或者Git仓库.也就是说,可以将当前提交导出至其他分支或者项目中. 举个例子,项目A.B中使 ...
- 怎么学JavaScript?
作者:小不了链接:https://zhuanlan.zhihu.com/p/23265155来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 鉴于时不时,有同学私信问我( ...
- idea-生成key的Java代码
import java.math.BigInteger; import java.util.Date; import java.util.Random; import java.util.Scanne ...
- CSS3+JS切割轮播图
以下说明数据,是指有4张图片的轮播图,分别切割成4张. 首先,做成单张切换的立体效果,即通过旋转,确定四张图片的位置,分别是一个立方体的上下前后的图片翻转移动角度. .box ul li:nth-ch ...
- 『U3D学习』破坏神回忆图<二>技能系统