Vue父组件向子组件传值,且要监听该值的变化
vue父组件向子组件传值时,如果值会根据父组件的相关操作而变化,则需要在子组件里用watch对其进行监听1、父组件<template><div><air-station :value="value"></air-station></div></template>import AirStatio...
·
vue父组件向子组件传值时,如果值会根据父组件的相关操作而变化,则需要在子组件里用watch对其进行监听
1、父组件
<template>
<div>
<air-station :value="value"></air-station>
</div>
</template>
import AirStation from '../components/air/AirStation'
export default {
components: {
AirStation,
},
data(){
return{
value:'',
}
},
methods:{
onZdzClick(item){
this.value=item.id;
}
}
}
2、子组件
<template>
<div>
</div>
</template>
<script>
export default {
props: ['value'], //父组件传来的值放到props里,而非data里定义
data () {
return {}
},
methods: {
queryData(param) {
}
},
watch:{ //监听value的变化,进行相应的操作即可
value: function(a,b){ //a是value的新值,b是旧值
this.queryData(a);
}
}
}
</script>
更多推荐
已为社区贡献4条内容
所有评论(0)