vuedata变量相互赋值后被实时同步的解决步骤
数据结构是这样⼦的vue json字符串转数组
data() {
return {
title: 'web前端 this data变量相互赋值后被实时同步问题',
val_1: 'vue',
val_2: ''
}
}
问题源:
我们在onload()把val_1 赋给 val_2 (或者在⽤户click时更改也都会出现这个问题)
onload() {
this.val_2 = this.val_1;
}
解决⽅法:
我们在通过JavaScript把 “val_1” 转换成字符串类型,再JSON.parse,最后再赋给 “val_2” 就解决了
onload() {
this.val_2 = JSON.parse(JSON.stringify(this.val_1));
}
补充知识:vue定义的全局变量在⼀个⽅法赋值过后在另⼀个⽅法中是空
在学习vue的过程中,发现了许多⼩的问题,例如:我定义⼀个全局变量a,为了可以在下⾯定义的⽅法中⼀直取得到这个全局变量,在⽅法中我添加了⼀个jquery的click⽅法,在这个⽅法⾥⾯⽤this.a = b(⾃定义的⼀个变量);然后到另⼀个⽅法中去使⽤这个全局变量a,发现根本没有进⾏赋值,还是原来的全
局变量的值。
原因如下:因为click函数使this的指向发⽣了变化。所以要在click函数的外⾯添加⼀句:
var self = this;
然后在click函数⾥⾯为全局变量赋值要写:
self.a = b;
这样就不会改变this的指向了!
以上这篇vue data变量相互赋值后被实时同步的解决步骤就是⼩编分享给⼤家的全部内容了,希望能给⼤家⼀个参考,也希望⼤家多多⽀持。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论