中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

Vue3中怎么修改父組件傳遞到子組件中的值

發布時間:2023-04-15 13:55:04 來源:億速云 閱讀:130 作者:iii 欄目:開發技術

這篇文章主要介紹了Vue3中怎么修改父組件傳遞到子組件中的值的相關知識,內容詳細易懂,操作簡單快捷,具有一定借鑒價值,相信大家閱讀完這篇Vue3中怎么修改父組件傳遞到子組件中的值文章都會有所收獲,下面我們一起來看看吧。

自定義組件上使用v-model

父組件:

//此處是父組件中引入的子組件
<ChildrenView  v-model:num="num"/>

//定義數據
let num=ref(10);//定義num為10,傳遞給子組件

子組件:

<script setup>
	//子組件接收父組件傳遞過來的數據
	let props=defineProps({
		num:number;
	});
	console.log(props.num)//接收過來的數據num=10

	//重點:開始修改子組件傳遞過來的num
	//1.引入我們的 **emit("自定義事件名",傳遞的數據)** 函數,用來觸發自定義事件
	//2.使用emit()
	let emit=defineEmits(["update:num"]);//自定義的更新num事件
	//3.假設子組件里的有個按鈕,執行的是這個changeNum事件
	let changeNum=()=>{
		emit("update:num",100);//觸發自定義事件,將父組件的num修改為100
	}
	
</script>

注意:
1.大家肯定有疑惑,這個emit()不就是子傳父的時候用的嗎,那么父組件上不應該去綁定這個update:num嗎?
如下:父組件:<ChildrenView v-model:num="num" @update:num="changeNum" >
是的,確實是子傳父用的,但是你沒必要再去綁定@update:num了。
why?
因為尤大大在自定義組件上使用v-model自己已經做過了處理,所以你只需要emit(“定義update:值”,數據)即可修改父組件的值了

關于“Vue3中怎么修改父組件傳遞到子組件中的值”這篇文章的內容就介紹到這里,感謝各位的閱讀!相信大家對“Vue3中怎么修改父組件傳遞到子組件中的值”知識都有一定的了解,大家如果還想學習更多知識,歡迎關注億速云行業資訊頻道。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

建始县| 平潭县| 南安市| 松溪县| 东莞市| 灌南县| 肃南| 神木县| 陆川县| 舒城县| 华亭县| 锦州市| 江油市| 迁西县| 内江市| 汉阴县| 娱乐| 新绛县| 杨浦区| 中江县| 云安县| 长沙市| 吉首市| 广丰县| 密山市| 榆社县| 彰化市| 甘洛县| 安溪县| 武邑县| 贺州市| 扶余县| 松原市| 金乡县| 阿瓦提县| 凯里市| 鄂托克前旗| 那坡县| 东乌珠穆沁旗| 邮箱| 赣州市|