Vue是一種非常受歡迎的JavaScript框架,用于構(gòu)建用戶界面。其中,input值綁定是Vue中經(jīng)常使用的特性之一。
input值綁定可以幫助我們將表單中的輸入和Vue實(shí)例中的數(shù)據(jù)關(guān)聯(lián)起來。這意味著當(dāng)表單輸入的值發(fā)生變化時,Vue實(shí)例中的數(shù)據(jù)也會隨之改變,并可在頁面中實(shí)時更新。
<div id="app"> <input type="text" v-model="message"> <p>{{ message }}</p> </div> <script> new Vue({ el: '#app', data: { message: '' } }); </script>
在上面的代碼中,我們創(chuàng)建了一個Vue實(shí)例,并定義了一個data屬性:message。該屬性與文本框的輸入值進(jìn)行了雙向綁定,即通過v-model指令實(shí)現(xiàn)了input值綁定的功能。
當(dāng)文本框中的值發(fā)生變化時,message屬性也會相應(yīng)地更新。由此,我們可以在頁面中動態(tài)地顯示輸入框中的值。