父组件：
<detailDrawer :showDrawer="showDrawer" :id="id" v-if="showDrawer" :closeCallBack="closeDrawer"></detailDrawer>
</div>
</template>
<script>
import detailDrawer from './components/DetailDrawer.vue'
export default {
components:{
detailDrawer,
},
data(){
return{
showDrawer:false,//抽屉是否可见
}
},
methods:{
//关闭抽屉
closeDrawer(){
this.showDrawer = false
},
}
子组件：
<template>
<el-drawer title="参与人员" :visible="showDrawer" direction="rtl" close-on-press-escape class="fontSize16" size="61vw" :wrapperClosable="false" @close="closeCallBack">
。。。
export default {
props: {
showDrawer: {
type: Boolean,
default: false
},
id: {
type: String,
required: true
},
<!--传递过来的方法：-->
closeCallBack: {
// 点击关闭抽屉处理方法
type: Function
}
},
}
