vue data變量相互賦值后被實(shí)時(shí)同步的解決步驟
數(shù)據(jù)結(jié)構(gòu)是這樣子的
data() {
return {
title: 'web前端 this data變量相互賦值后被實(shí)時(shí)同步問(wèn)題',
val_1: 'vue',
val_2: ''
}
}
問(wèn)題源：
我們?cè)趏nload()把val_1 賦給 val_2 (或者在用戶click時(shí)更改也都會(huì)出現(xiàn)這個(gè)問(wèn)題)
onload() {
this.val_2 = this.val_1;
}
解決方法：
我們?cè)谕ㄟ^(guò)JavaScript把 “val_1” 轉(zhuǎn)換成字符串類(lèi)型，再JSON.parse，最后再賦給 “val_2” 就解決了
onload() {
this.val_2 = JSON.parse(JSON.stringify(this.val_1));
}
補(bǔ)充知識(shí)：vue定義的全局變量在一個(gè)方法賦值過(guò)后在另一個(gè)方法中是空
在學(xué)習(xí)vue的過(guò)程中，發(fā)現(xiàn)了許多小的問(wèn)題，例如：我定義一個(gè)全局變量a，為了可以在下面定義的方法中一直取得到這個(gè)全局變量，在方法中我添加了一個(gè)jquery的click方法，在這個(gè)方法里面用this.a = b(自定義的一個(gè)變量)；然后到另一個(gè)方法中去使用這個(gè)全局變量a，發(fā)現(xiàn)根本沒(méi)有進(jìn)行賦值，還是原來(lái)的全局變量的值。
原因如下：因?yàn)閏lick函數(shù)使this的指向發(fā)生了變化。所以要在click函數(shù)的外面添加一句：
var self = this;
然后在click函數(shù)里面為全局變量賦值要寫(xiě)：
self.a = b;
這樣就不會(huì)改變this的指向了！
以上這篇vue data變量相互賦值后被實(shí)時(shí)同步的解決步驟就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Vue+Element實(shí)現(xiàn)表格編輯、刪除、以及新增行的最優(yōu)方法
這篇文章主要為大家詳細(xì)介紹了Vue+Element實(shí)現(xiàn)表格的編輯、刪除、以及新增行的最優(yōu)方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-05-05
這篇文章主要為大家詳細(xì)介紹了Vue.js路由vue-router使用方法,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-03-03
vue3 開(kāi)始時(shí)間與結(jié)束時(shí)間比較驗(yàn)證(結(jié)束時(shí)間需要大于開(kāi)始時(shí)間)
本文通過(guò)示例代碼介紹了vue3 開(kāi)始時(shí)間與結(jié)束時(shí)間比較驗(yàn)證(結(jié)束時(shí)間需要大于開(kāi)始時(shí)間)的相關(guān)操作,代碼簡(jiǎn)單易懂,感興趣的朋友跟隨小編一起看看吧2024-07-07
vue實(shí)現(xiàn)下拉加載其實(shí)沒(méi)那么復(fù)雜
這篇文章主要給大家介紹了關(guān)于vue實(shí)現(xiàn)下拉加載的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用vue具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-08-08
數(shù)組去重是我面試時(shí)候經(jīng)常會(huì)問(wèn)到應(yīng)聘者的一個(gè)問(wèn)題,所以下面這篇文章主要給大家介紹了關(guān)于前端vue數(shù)組去重的三種方法,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-06-06
今天小編就為大家分享一篇vue綁定事件后獲取綁定事件中的this方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-09-09
這篇文章主要介紹了vue-路由精講 二級(jí)路由和三級(jí)路由的作用，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-08-08
這篇文章主要為大家詳細(xì)介紹了Vue通過(guò)input篩選數(shù)據(jù)的相關(guān)代碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-05-05
這篇文章主要介紹了如何抽象一個(gè)Vue公共組件，以一個(gè)數(shù)字鍵盤(pán)組件為例，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-10-10
vue-quill-editor富文本編輯器簡(jiǎn)單使用方法
這篇文章主要為大家詳細(xì)介紹了vue-quill-editor富文本編輯器簡(jiǎn)單使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-09-09