This time I will bring you a practical analysis of the Vue.js two-way binding project. What are the precautions for the Vue.js two-way binding project? The following is a practical case, let's take a look.
This article is about experiencing the two-way binding of VUE
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
<p id="app">
<input type="text" v-model="CurrentTime" placeholder="当前时刻">
<h1>当前时刻{{ CurrentTime }}</h1>
</p>
<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> 
event called when el is mounted to the instance.
beforeDestory is the called before the instance is destroyed. In the above example, in the mounted event A I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the PHP Chinese website! Recommended reading:How to use vue to crop the preview component
How to use Vue to implement hovering in the upper right corner of the page /hide menu
The above is the detailed content of Practical analysis of Vue.js two-way binding project. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
