From 7c63241cd04a33b2315b5021f209bcc9efb03358 Mon Sep 17 00:00:00 2001
From: wangchen <wangchen.flsion@bytedance.com>
Date: Fri, 15 Dec 2023 19:13:55 +0800
Subject: [PATCH] enhance(cascader): add props watch

---
 .../arco-vue-docs/components/aside-nav/style.less   |  9 ++++++---
 packages/web-vue/components/cascader/cascader.vue   | 13 +++++++++++++
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/packages/arco-vue-docs/components/aside-nav/style.less b/packages/arco-vue-docs/components/aside-nav/style.less
index cdea6ba98..9d1873184 100644
--- a/packages/arco-vue-docs/components/aside-nav/style.less
+++ b/packages/arco-vue-docs/components/aside-nav/style.less
@@ -136,15 +136,18 @@
     margin: 0 0 4px;
     padding: 0 12px;
 
+    .aside-nav-item-link {
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
+
     &-active {
       font-weight: 500;
       background-color: var(--color-fill-2) !important;
 
       .aside-nav-item-link {
-        overflow: hidden;
         color: rgb(var(--arcoblue-6));
-        white-space: nowrap;
-        text-overflow: ellipsis;
       }
     }
 
diff --git a/packages/web-vue/components/cascader/cascader.vue b/packages/web-vue/components/cascader/cascader.vue
index 579c2aff6..4f72b110c 100644
--- a/packages/web-vue/components/cascader/cascader.vue
+++ b/packages/web-vue/components/cascader/cascader.vue
@@ -553,6 +553,8 @@ export default defineComponent({
       valueKey,
       expandTrigger,
       expandChild,
+      pathMode,
+      multiple,
     } = toRefs(props);
     const _value = ref(props.defaultValue);
     const _inputValue = ref(props.defaultInputValue);
@@ -682,6 +684,17 @@ export default defineComponent({
       eventHandlers.value?.onChange?.();
     };
 
+    watch([multiple, pathMode], () => {
+      const values: any[] = [];
+      computedValueMap.value.forEach((value, key) => {
+        const option = leafOptionMap.get(key);
+        if (option) {
+          values.push(pathMode.value ? option.pathValue : option.value);
+        }
+      });
+      updateValue(values);
+    });
+
     const handlePopupVisibleChange = (visible: boolean): void => {
       if (computedPopupVisible.value !== visible) {
         _popupVisible.value = visible;