Vue雙向數據綁定指令——v-mode

前面我講了V-bind指令,該指令只能實現數據的單向綁定,從M自動綁定到V,無法實現數據的雙向綁定。不能將數據傳回mv控制的m中,也就是不能將數據傳回邏輯層。這樣前端和邏輯層便不能進行數據交互。爲解決此問題,v-model指令應運而生。v-model指令,可以實現表單元素和Model中數據的雙向數據綁定。
下面是我寫的例子,當text中的內容改變的時候,h4標籤中的內容也會隨之改變

 		<h4>{{msg}}</h4>
        <input type="text" v-model:value="msg" style="width:100%;">

在這裏插入圖片描述可以在控制檯輸入Windows.vue名字 查看vue
vue中msg的值也會隨之改變,這樣改變的值就會傳回vue,邏輯代碼就可以根據變化從而進行一些操作。
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章