在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.变 ...
随机推荐
- ABAP工作区,内表,标题行的定义和区别
工作区域跟变量一样,是用来保存数据的.区别是变量只能从中保存一个数据.而工作区域可以存放多个.把多个数据合在一起就成工作区域了.下面我们来看看工作区域是如何定义的吧.定义有四种方法,如下:1 ...
- LinuxMint17.1 Rebecca中安装设置输入法
LinuxMint14使用了几年一直未更新,突然想去更新一下去发现源已经不支持了,所以就直接安装了最新版本. 安装好以后发现还是跟以前一样的毛病,没有中文输入法,直接sudo aptitude ins ...
- Android 学习第15课,Android 开发的单元测试、及输出错误信息
这一节没有做实例,单元测试,以后用到再写吧
- win32记事本程序(一)
我不会取标题,大体上我想用win32,模仿windows的记事本,写个记事本程序,最后让我的程序和微软的程序在外观和功能上都差不多.这样一来我可以学到一些新知识,巩固旧的知识. 一.首先做个菜单栏吧. ...
- 原创: How to build a query based on Definition Updates installed
In SCCM 2012 R2, you can use following class. Use SMS_CombinedDeviceResources.EPAntivirusSignatureLa ...
- python中try except执行顺序
python中try except finally的执行顺序 先执行try中语句 如果try中抛出异常, 执行异常中语句. 如果try 或 except 中没有return语句,执行完try 或者 e ...
- WebLogic口令猜解工具【Python脚本】
WebLogic 默认端口7001 可以通过如下链接访问控制台 http://10.9.1.1:7001/console/login/LoginForm.jsp 写了一个简单的猜解脚本,半成品,做个记 ...
- ES6笔记一
遍历数组: 1:传统的 for (var index = 0; index < myArray.length; index++) { console.log(myArray[index]);} ...
- PHP比较操作符详解(转自hack58)
php的比较操作符有==(等于)松散比较,===(完全等于)严格比较,这里面就会引入很多有意思的问题. 在松散比较的时候,php会将他们的类型统一,比如说字符到数字,非bool类型转换成bool类型, ...
- JPanel
class NewPanel extends JPanel{ public NewPanel() {} public void paintComponent(Graphics g) { int x=0 ...