vue組件watch屬性實例講解

來源：九壹網(wǎng)

本文實例為大家分享了vue組件watch屬性的具體代碼，供大家參考，具體內(nèi)容如下

<!doctype html>
<html>
 <head>
 <meta charset="UTF-8">
 <title>wacth屬性</title>
 <script src="js/vue.js"></script>
 </head>
 <body>
 <div id="container">
 <p>{{msg}}</p>
 <my-component></my-component>
 </div>
 <script>
 Vue.component("my-component",{
 data:function(){
 return {
 myInput:"",
 myPhone:123456
 }
 },
 template:`
 <div>
 <input type="text" v-model="myInput"/>
 <input type="text" v-model="myPhone"/>
 <span>{{myInput}}</span>
 </div>
 `,
 watch:{
 myInput:function(){
 //當數(shù)據(jù)發(fā)生變化、執(zhí)行的操作
 　　 console.log("數(shù)據(jù)改變");
 },
 myPhone:function(){
 console.log(this.myPhone);
 }
 }
 })
 new Vue({
 el:"#container",
 data:{
 msg:"Hello VueJs"
 }
 })
 </script>
 </body>
</html>

違法及侵權(quán)請聯(lián)系：TEL:199 1889 7713 E-MAIL:2724546146@qq.com

本站由北京市萬商天勤律師事務(wù)所王興未律師提供法律服務(wù)

成熟丰满熟妇高潮XXXXX,人妻无码AV中文系列久久兔费 ,国产精品一国产精品,国精品午夜福利视频不卡麻豆

vue組件watch屬性實例講解