快捷導(dǎo)航

Vue子組件監(jiān)聽父組件值的變化

更新時(shí)間：2022年04月01日 10:08:24 作者：ttt_tangyuan

這篇文章主要介紹了Vue子組件監(jiān)聽父組件值的變化方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教

子組件監(jiān)聽父組件值變化

子組件中利用watch監(jiān)聽父組件值的變化

// 子組件
props: ["a"],
?? ?watch: {
?? ??? ?a(oldValue, newValue) {
?? ??? ??? ?// oldValue ?a舊值
?? ??? ??? ?// newValue a新值
?? ??? ?}
?? ?}

子組件監(jiān)聽父組件的值同步更新數(shù)據(jù)

子組件

props : [“data”],

子組件監(jiān)聽

?? ?watch:{
? ? data : (n ,o) => {//箭頭函數(shù) ?不然會(huì)發(fā)生this改變
? ? ? ? console.log(n.img)
? ? ? ? this.imgs = n.img
? ? ? }
?}

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

vuex?mutation?action同級(jí)調(diào)用方式
這篇文章主要介紹了vuex?mutation?action同級(jí)調(diào)用方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-03-03
element-ui表格如何自適應(yīng)高度效果示例
這篇文章主要給大家介紹了關(guān)于element-ui表格如何自適應(yīng)高度的相關(guān)資料,Element UI的Table組件默認(rèn)情況下是沒有自適應(yīng)高度的,文中給大家介紹了解決的辦法,需要的朋友可以參考下
2023-08-08
Vue組件中常見的props默認(rèn)值陷阱問題
這篇文章主要介紹了避免Vue組件中常見的props默認(rèn)值陷阱,本文通過問題展示及解決方案給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2023-09-09
這篇文章主要給大家總結(jié)介紹了關(guān)于vue中八種組件通信方式的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用vue具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧
2019-08-08

vue項(xiàng)目記錄鎖定和解鎖功能實(shí)現(xiàn)

這篇文章主要為大家詳細(xì)介紹了vue項(xiàng)目記錄鎖定和解鎖功能實(shí)現(xiàn)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

2022-03-03

vue中this.$refs.name.offsetHeight獲取不到值問題

這篇文章主要介紹了vue中this.$refs.name.offsetHeight獲取不到值問題及解決，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教

2023-05-05

vue使用路由router-view的詳細(xì)代碼

這篇文章主要介紹了vue使用路由router-view的相關(guān)知識(shí),其原理就是采用?SPA(single-page-application)?模式,就是只有一個(gè)?Web?頁(yè)面的應(yīng)用,通過?router?來控制頁(yè)面的刷新和迭代,感興趣的朋友一起看看吧

2023-12-12