From 65f36a0a61d710ac148570f0949bc985f75cd648 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=B1=E7=9C=A0=E5=84=80=E5=BC=8F?= <854085467@qq.com>
Date: Sun, 8 May 2022 23:18:06 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B:=20=E4=BF=AE=E5=A4=8D=20changeOpen?=
 =?UTF-8?q?Keys=20=E5=86=85=E5=AD=98=E5=BC=95=E7=94=A8=E7=9A=84=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package/component/src/component/menu/index.vue     | 10 +++++-----
 package/component/src/component/subMenu/index.vue  |  6 ++++--
 .../document/src/document/zh-CN/components/menu.md | 14 ++++++++++++--
 3 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/package/component/src/component/menu/index.vue b/package/component/src/component/menu/index.vue
index 2fb6bbd7..eb2c0d3f 100644
--- a/package/component/src/component/menu/index.vue
+++ b/package/component/src/component/menu/index.vue
@@ -5,7 +5,7 @@ export default {
 </script>
 
 <script setup lang="ts">
-import { computed, provide, ref, watch } from "vue";
+import { computed, ComputedRef, provide, Ref, ref, watch, WritableComputedRef } from "vue";
 import "./index.less";
 
 export interface LayMenuProps {
@@ -39,10 +39,10 @@ const props = withDefaults(defineProps<LayMenuProps>(), {
   childSpacing: false,
 });
 
-const isTree = computed(() => props.tree);
-const isCollapse = computed(() => props.collapse);
-const isCollapseTransition = computed(() => props.collapseTransition);
-let oldOpenKeys = ref<string[]>(props.openKeys);
+const isTree: ComputedRef = computed(() => props.tree);
+const isCollapse: ComputedRef = computed(() => props.collapse);
+const isCollapseTransition: ComputedRef = computed(() => props.collapseTransition);
+const oldOpenKeys: Ref = ref<string[]>(props.openKeys);
 
 const openKeys = computed({
   get() {
diff --git a/package/component/src/component/subMenu/index.vue b/package/component/src/component/subMenu/index.vue
index 0c0ab796..3cee9c3f 100644
--- a/package/component/src/component/subMenu/index.vue
+++ b/package/component/src/component/subMenu/index.vue
@@ -48,11 +48,13 @@ watch(isOpen, () => {
 
 const openHandle = function () {
   if (!isCollapse.value) {
+    let newOpenKeys = [...openKeys.value];
     if (openKeys.value.includes(props.id)) {
-      openKeys.value.splice(openKeys.value.indexOf(props.id), 1);
+      newOpenKeys.splice(newOpenKeys.indexOf(props.id), 1)
     } else {
-      openKeys.value.push(props.id);
+      newOpenKeys.push(props.id);
     }
+    openKeys.value = newOpenKeys;
   }
 };
 
diff --git a/package/document/src/document/zh-CN/components/menu.md b/package/document/src/document/zh-CN/components/menu.md
index 0a60b951..818b0bfa 100644
--- a/package/document/src/document/zh-CN/components/menu.md
+++ b/package/document/src/document/zh-CN/components/menu.md
@@ -59,7 +59,8 @@ export default {
 ::: demo
 
 <template>
-  <lay-menu v-model:selectedKey="selectedKey" v-model:openKeys="openKeys2" :tree="true">
+  选中：{{ selectedKey }} 打开： {{ openKeys2 }}
+  <lay-menu :selectedKey="selectedKey" @changeSelectedKey="changeSelectedKey" @changeOpenKeys="changeOpenKeys" v-model:openKeys="openKeys2" :tree="true">
     <lay-menu-item id="1">首页</lay-menu-item>
     <lay-menu-item id="2">首页</lay-menu-item>
     <lay-menu-item id="3">首页</lay-menu-item> 
@@ -89,10 +90,19 @@ export default {
 
     const openKeys2 = ref(["7"])
     const selectedKey = ref("5")
+    const changeSelectedKey = (val) => {
+      selectedKey.value = val;
+    }
+
+    const changeOpenKeys = (val) => {
+      openKeys2.value = val;
+    }
 
     return {
       openKeys2,
-      selectedKey
+      selectedKey,
+      changeOpenKeys,
+      changeSelectedKey
     }
   }
 }