vue3 elementplus el-popover组件点击外部区域无法关闭问题

1、从elemtn-plus中导入ClickOutside指令
import { ClickOutside as vClickOutside } from 'element-plus'

从elemtn-plus中导入ClickOutside指令
//import { ClickOutside as vClickOutside } from 'element-plus'
<scrpit>
import { ClickOutside as vClickOutside } from 'element-plus';
</script>

2、从元素上绑定对应的指令
v-click-outside= "onClickOutside"

//从元素上绑定对应的指令
//v-click-outside= "onClickOutside"
 <el-popover width="74%" :visible="popoverVisible" @show="showPopoverHandler" @hide="closePopoverHandler">
       <template #reference>
                <el-select ref="selectRef" @focus="inputFocus" style="width: 99%"
 size="small" popper-class="el-select-popper" />
        </template>
             <div v-click-outside="onClickOutside">
                <el-form :inline="true" :model="formInline">
                 </el-form>
                <el-table @row-dblclick="rowClick" :data="equipListPageList" width="100%"
               :header-cell-style="{ 'background': '#F2F2F2' }"></el-table>
                 <el-pagination v-model:current-page="currentPage" v-model:page- 
                 size="pageSize" :page-sizes="[5, 10, 15, 20]" :small="small" 
                 :disabled="disabled" background layout="total, sizes, prev, pager, next, 
                 jumper" :total="total"@size-change="handleSizeChange" @current- 
                 change="handleCurrentChange" :teleported="false" />
             </div>

 </el-popover>

3、onClickOutside绑定对应的方法

<script>
const onClickOutside = () => {
    popoverVisible.value = false
}
</script>