亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

Vue.js 踩坑記之雙向綁定

 更新時(shí)間:2018年05月03日 16:44:14   作者:lee576  
這篇文章給大家?guī)砹薞ue.js 踩坑記之雙向綁定問題,非常不錯(cuò),具有參考借鑒價(jià)值,感興趣的朋友跟隨腳本之家小編一起學(xué)習(xí)吧

這篇體驗(yàn)一下VUE的雙向綁定

<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <script src="https://unpkg.com/vue/dist/vue.min.js"></script>
  <div id="app">
    <input type="text" v-model="CurrentTime" placeholder="當(dāng)前時(shí)刻">
    <h1>當(dāng)前時(shí)刻{{ CurrentTime }}</h1>
  </div>
  <script>
  var app = new Vue({
    el:'#app',
    data:{
      CurrentTime: new Date()
    },
    mounted:function(){
      var _this = this;
      this.timer = setInterval(function(){
        _this.CurrentTime = new Date();
      },1000);
    },
    beforeDestroy:function(){
      if(this.timer){
        clearInterval(this.timer);
      }
    }
  });
  </script>
</body>
</html>

 

{{ }} 是所謂的文本插值的方法,目的是顯示雙向綁定的數(shù)據(jù)

mounted 表示el掛載到實(shí)例上調(diào)用的事件

beforeDestory 是實(shí)例銷毀以前調(diào)用

在上例中,在mounted事件中創(chuàng)建了一個(gè)定時(shí)器,每隔一秒就把當(dāng)前時(shí)間寫入文本框中,由于雙向綁定的原因,H1標(biāo)簽的文本也會(huì)跟著變化,和文本框的文本保持一致。在beforeDestory事件里在Vue實(shí)例銷毀前則會(huì)清除定時(shí)器

總結(jié)

以上所述是小編給大家介紹的Vue.js 踩坑記之雙向綁定,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!

相關(guān)文章

最新評(píng)論