vue点击弹框外部关闭弹框

<template>
    <div class="passwordError">
        <van-overlay 
            :show="show" 
            @click="clickOverlay"
        >
            <div class="content" ref="contentWrapper">
                内部区域
            </div>
        </van-overlay>
    </div>
</template>

<script>
export default {
    data () {
        return {

        }
    },
    props:{
        visible:{
            required:true,
            type:Boolean,
            default:false
        }
    },
    computed:{
        show:{
            get(){
                return this.visible
            },
            set(v){
                this.$emit('close',v)
            }
        }
    },
    methods:{
        clickOverlay(e){
        
            let tree = this.$refs.contentWrapper.contains(e.target) // 这最关键的代码,判断是否点击了内部区域
            if(!tree){
                this.$emit('close')
            }
        },
        
    }
}
</script>