【Vue】组件watch props属性值
#HTML
<div id="example"> <p> <child :msg="msg"></child> </p> <p> <button @click='props'>改变props</button> </p> </div>
#JS Vue.component('child', { props: ['msg'], computed: { value:{ get:function(){ return this.msg }, set:function(value){ this.msg = value; } } }, watch:{ msg:function(val,oldval){ this.value='改变子组件msg'; } }, template: '<span>{{ value }}</span>' }) var vm=new Vue({ el:'#example', data:function(){ return{ msg:'默认子组件msg' } }, methods:{ props:function(){ this.$set('msg','2'); } } })
代码: https://jsfiddle.net/kakarrot2009/ebeqhr6x/