VUE 數據雙向綁定

 

 雙向綁定就是指 : 數據在賦值到頁面時,頁面值的修改也會影響data修改

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>數據綁定</title>
    <script src="./vue.js"></script>
  </head>
  <body>
  		<!-- 單向數據 綁定 -->
  		<div id="root">{{msg}}</div>
      <!-- 雙向數據 綁定 -->
      <div id="rootOt" >
      <input v-model="msg" />
      {{msg}}
      </div>
  		<script>
  			var vm = new Vue({
  				el: "#root",/*掛載點*/
  				data:{
  					msg: "hello world!"
  				}
  			})

        var vmOt = new Vue({
          el: "#rootOt",/*掛載點*/
          data:{
            msg: "hello world"
          }
        })
  		</script>
  </body>
</html>

 

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