fix(comp:cascader): selected and expanded status is display incorrect…

…ly (#1386)
IDuxFE · Jan 6, 2023 · 847f139 · 847f139
1 parent b77fac6
commit 847f139
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 3 deletions.
diff --git a/packages/components/cascader/src/composables/useExpandable.ts b/packages/components/cascader/src/composables/useExpandable.ts
@@ -18,6 +18,7 @@ import { type MergedData, convertMergedData, convertMergedDataMap } from './useD
 
 export interface ExpandableContext {
   expandedKeys: ComputedRef<VKey[]>
+  setExpandedKeys: (value: VKey[]) => void
   handleExpand: (key: VKey) => void
   loadingKeys: Ref<VKey[]>
 }
@@ -104,5 +105,5 @@ export function useExpandable(
     callChange(mergedDataMap, newKeys, onExpandedChange)
   }
 
-  return { expandedKeys, handleExpand, loadingKeys }
+  return { expandedKeys, setExpandedKeys, handleExpand, loadingKeys }
 }
diff --git a/packages/components/cascader/src/contents/OverlayOption.tsx b/packages/components/cascader/src/contents/OverlayOption.tsx
@@ -7,6 +7,8 @@
 
 import { type PropType, Slot, computed, defineComponent, inject, normalizeClass } from 'vue'
 
+import { isNil } from 'lodash-es'
+
 import { IxCheckbox } from '@idux/components/checkbox'
 import { convertIconVNode, useKey } from '@idux/components/utils'
 
@@ -35,9 +37,10 @@ export default defineComponent({
       activeKey,
       setActiveKey,
       expandedKeys,
+      setExpandedKeys,
       setOverlayOpened,
       loadingKeys,
-      selectedKeys,
+      selectedWithStrategyKeys,
       selectedLimit,
       selectedLimitTitle,
       indeterminateKeys,
@@ -48,7 +51,7 @@ export default defineComponent({
     const isDisabled = computed(() => props.rawData.disabled)
     const isExpanded = computed(() => expandedKeys.value.includes(key))
     const isLoading = computed(() => loadingKeys.value.includes(key))
-    const isSelected = computed(() => selectedKeys.value.includes(key))
+    const isSelected = computed(() => selectedWithStrategyKeys.value.includes(key))
     const isIndeterminate = computed(() => indeterminateKeys.value.includes(key))
 
     const classes = computed(() => {
@@ -71,6 +74,9 @@ export default defineComponent({
         }
         handleSelect(key)
         setOverlayOpened(false)
+
+        // 如果一级节点是叶子节点，被点击后关闭所有展开的节点。
+        isNil(props.parentKey) && setExpandedKeys([])
       } else {
         cascaderProps.strategy === 'off' && handleSelect(key)
         cascaderProps.expandTrigger === 'click' && handleExpand(key)