vue变量赋值到html,jsvue data变量相互赋值后被实时同步的解决步骤js大全-js开发...

本文介绍了在Vue.js中遇到的data属性值实时同步问题。当在onload或click事件中将val_1赋值给val_2时,两者会保持同步。解决办法是利用JSON.parse和JSON.stringify将val_1转换为字符串后再赋值给val_2,避免直接引用导致的同步。此外,还讲解了在Vue中如何正确处理this指针变化,确保全局变量在不同方法间保持正确值。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

首页 >> js开发 >> jsvue data变量相互赋值后被实时同步的解决步骤js大全

jsvue data变量相互赋值后被实时同步的解决步骤js大全

发布时间: 2021年1月13日 | 浏览:

| 分类:js开发

数据结构是这样子的

data() {

return {

title: 'web前端 this data变量相互赋值后被实时同步问题',

val_1: 'vue',

val_2: ''

}

}

data() {

return {

title: 'web前端 this data变量相互赋值后被实时同步问题',

val_1: 'vue',

val_2: ''

}

}问题源:问题源:我们在onload()把val_1 赋给 val_2 (或者在用户click时更改也都会出现这个问题)

onload() {

this.val_2 = this.val_1;

}

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));

}

onload() {

this.val_2 = JSON.parse(JSON.stringify(this.val_1));

}补充知识:vue定义的全局变量在一个方法赋值过后在另一个方法中是空补充知识:补充知识:vue定义的全局变量在一个方法赋值过后在另一个方法中是空在学习vue的过程中,发现了许多小的问题,例如:我定义一个全局变量a,为了可以在下面定义的方法中一直取得到这个全局变量,在方法中我添加了一个jquery的click方法,在这个方法里面用this.a = b(自定义的一个变量);然后到另一个方法中去使用这个全局变量a,发现根本没有进行赋值,还是原来的全局变量的值。原因如下:因为click函数使this的指向发生了变化。所以要在click函数的外面添加一句:原因如下:

var self = this;

var self = this;然后在click函数里面为全局变量赋值要写:

self.a = b;

self.a = b;这样就不会改变this的指向了!以上这篇vue data变量相互赋值后被实时同步的解决步骤就是小编分享给大家的全部内容了,希望能给大家一个参考。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值