Vue组件 父组件使用子组件中的值(子组件给父组件传值的方法)
父组件给子组件传值使用props自定义属性来实现,子组件传值给父组件可以用自定义事件和事件发射来实现,以下是具体实现方法。
一、父组件内容 @isErrShow自定义事件
<template> <div class="certification"> <Success v-if="successShow"></Success> <error v-if="errorShow" @isErrShow="isErrshow"></error> // @isErrShow自定义方法 <Now v-if="nowShow"></Now> </div> </template>
二、父组件方法
methods:{ isErrshow(data){ //data就是子组件传过来的值 console.log(data) this.data=data; } }
三、子组件内容
<template> <div> <el-button type="danger" @click="togo">重新认证</el-button> </div> </template>
四、子组件传值方法,通过this.$emit(name,value)。name对应的是父组件自定义方法的名称,value则是子组件需要传给父组件的值。
methods: { togo(){ this.$emit('isErrShow',"1") //事件发射 } }