vue学习笔记8-监听属性-watch

<div id="app">
    千米: <input type="text" id="" value="" v-model="kilo"/><br />
    米: <input type="text" id="" value="" v-model="meter"/>
</div>

如果想要这两个属性相互绑定,当然也可以给这两个标签添加事件响应属性。 也可以使用watch属性,来监听kilo和meter这两个属性。

var vm = new Vue({
    el:"#app",
    data : {
    kilo : 0,
    meter : 0
},
    watch : {
        kilo : function (val){
            this.kilo = val;
            this.meter = val * 1000;
        },
    meter : function(val){
            this.meter = val;
            this.kilo = val / 1000;
        }
    }
})

这样在kilo进行变化的时候就会触发函数,在meter变化的时候也会触发相对应的函数。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券