vue—子组件如何修改父组件的值
如何在子组件中修改父组件的值第一步:首先得保证父组件中有值吧这是userManage.vuedata(){return{dialogCreate:'false'}}第二步:在父组件中引用子组件import Form from './userCreate'第三步:父组件中注册子组件并引用<template>...
·
如何在子组件中修改父组件的值
第一步:首先得保证父组件中有值吧
这是userManage.vue
data(){
return{
dialogCreate:'false'
}
}
第二步:在父组件中引用子组件
import Form from './userCreate'
第三步:父组件中注册子组件并引用
<template>
<app-form></app-form>
</template>
<script>
export default{
name:'user',
components:{
"app-form":Form
},
data(){
return{
dialogCreate:'false'
}
}
}
</script>
第四步:把父组件的值绑定给子组件上
<app-form v-bind:dialogCreate = "dialogCreate" ></app-form>
第五步:既然父组件把值给了子组件了,子组件得接受和用吧
子组件
1.先接受
export default{
props:['dialogCreate']
}
2.就可以直接在自组建中用了
<p>{{dialogCreate}}</p>
第六步:向父组件发射一个方法
比如我们在后台数据接收成功时,告诉父组件已经成功
this.$emit('success',false);
第七步:父组件接收到这个方法并且执行改变父组件的值
<app-form v-bind:dialogCreate = "dialogCreate" v-on:success="success(res)"></app-form>
methods: {
check(){
alert(1);
},
success(res){
this.dialogCreate = res;
}
}
更多推荐
已为社区贡献2条内容
所有评论(0)