本篇為Vue3學(xué)習(xí)中遇到的v-model相關(guān)的記錄，如有問題歡迎指正
一、在標(biāo)簽上使用v-model
v-model通常在input、select等標(biāo)簽上來實(shí)現(xiàn)數(shù)據(jù)雙向綁定
<input type="text" v-model="username">原理：v-model通過給標(biāo)簽value賦值來實(shí)現(xiàn)? 數(shù)據(jù)—>頁面 的綁定。然后通過綁定input事件實(shí)現(xiàn) 頁面—>數(shù)據(jù) 的綁定。
<input type="text" :value="username" @input="username = $event.target.value">二、在組件標(biāo)簽上使用v-model
1、使用v-model默認(rèn)傳值
<Children v-model="username"/>
// 上面的v-model可以拆解為
<Children :modelValue="username" @update:modelValue="username = $event">原理：在組件上時(shí)，v-model通過 :modelValue 來進(jìn)行頁面?zhèn)髦?，然后通過子組件觸發(fā) update:modelValue 事件來對(duì)所綁定值進(jìn)行修改文章來源：http://www.zghlxwxcb.cn/news/detail-819862.html
2、使用v-model時(shí)指定參數(shù)名
<Children v-model:username="username"/>
<Children :username="username" @update:username="username = $event"/>優(yōu)點(diǎn)：可以自由指定參數(shù)名、事件名(update:xx)。并且可以同時(shí)綁定多個(gè)v-model值文章來源地址http://www.zghlxwxcb.cn/news/detail-819862.html
到了這里，關(guān)于Vue3-在HTML標(biāo)簽、組件標(biāo)簽上使用v-model的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
