子组件调用父组件的方法

子组件调用父组件的方法

使用场景：

父组件中有个弹窗（子组件），需要结合父组件和子组件的数据作为参数去请求
调用父组件的方法关闭子组件等

如：父组件是输入提现或充值的金额，点击确定弹出子组件，弹窗是展示输入的金额和费率，发送验证码输入验证码，
输入验证码，点击确定的时候需要给父组件传验证码并且调用父组件的方法

1. this.$parent.event
2. this.$emit()
3. 父组件把方法传给子组件

this.$parent.event

this.$parent.getBill(data);

this.$emit()

//父组件
<child @childern = "fatherMethods"/>

//子组件
<button @click ="confirm">确认</button>

methods:{
    confirm(){
            this.$emit('childern')
    }
}

父组件把方法传给子组件

//父组件
<child :childern = "fatherMethods"/>
//子组件
<script>
export default{
    props:{
            childern:{
                type:Function,
                default:null,            
            }
    },
    methods:{
        if(this.childern){
            this.childern()
        }
    }
}

参考文章 https://www.php.cn/faq/483395.html