el-drawer子组件关闭时调用父组件的方法

父组件:

        <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

        }

    },

}

 

©️2020 CSDN 皮肤主题: 数字20 设计师:CSDN官方博客 返回首页