From 7059ed1fc7d14bf512097b058a936066fee97833 Mon Sep 17 00:00:00 2001
From: Xc <124118265@qq.com>
Date: Tue, 14 Mar 2023 00:19:05 +0800
Subject: [PATCH] fix(components): [cascader] clickoutside (#11997)

* fix(components): [cascader] clickoutside

* fix(components): [cascader] clickoutside

* fix(components): [cascader] clickoutside

* fix(components): [cascader] clickoutside
---
 docs/en-US/component/cascader.md              |  1 +
 packages/components/cascader/src/cascader.vue | 10 +++++++++-
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/docs/en-US/component/cascader.md b/docs/en-US/component/cascader.md
index 2f61d870b2..128cf28fa1 100644
--- a/docs/en-US/component/cascader.md
+++ b/docs/en-US/component/cascader.md
@@ -194,6 +194,7 @@ cascader/panel
 | getCheckedNodes     | get an array of currently selected node,(leafOnly) whether only return the leaf checked nodes, default is `false` | ^[Function]`(leafOnly: boolean) => CascaderNode[] \| undefined` |
 | cascaderPanelRef    | cascader panel ref                                                                                                | ^[object]`ComputedRef<any>`                                     |
 | togglePopperVisible | toggle the visible type of popper                                                                                 | ^[Function]`(visible?: boolean) => void`                        |
+| contentRef          | cascader content ref                                                                                              | ^[object]`ComputedRef<any>`                                     |
 
 ## CascaderPanel API
 
diff --git a/packages/components/cascader/src/cascader.vue b/packages/components/cascader/src/cascader.vue
index 07eb27c770..bc3c34b43b 100644
--- a/packages/components/cascader/src/cascader.vue
+++ b/packages/components/cascader/src/cascader.vue
@@ -24,7 +24,7 @@
   >
     <template #default>
       <div
-        v-clickoutside:[cascaderPanelRef]="() => togglePopperVisible(false)"
+        v-clickoutside:[contentRef]="() => togglePopperVisible(false)"
         :class="cascaderKls"
         :style="cascaderStyle"
         @click="() => togglePopperVisible(readonly ? undefined : true)"
@@ -352,6 +352,10 @@ const inputClass = computed(() => {
   return nsCascader.is('focus', popperVisible.value || filterFocus.value)
 })
 
+const contentRef = computed(() => {
+  return tooltipRef.value?.popperRef?.contentRef
+})
+
 const togglePopperVisible = (visible?: boolean) => {
   if (isDisabled.value) return
 
@@ -685,5 +689,9 @@ defineExpose({
    * @description toggle the visible of popper
    */
   togglePopperVisible,
+  /**
+   * @description cascader content ref
+   */
+  contentRef,
 })
 </script>