From a18489d58c17a67d3790af3dffca9a1c7e057161 Mon Sep 17 00:00:00 2001
From: wuls <linsheng.wu@beantechs.com>
Date: Fri, 20 Nov 2020 11:10:02 +0800
Subject: [PATCH] fix: transition cannt work

---
 examples/docs/zh-CN/tag.md           |  2 +-
 examples/versions.json               |  2 +-
 packages/menu/__tests__/Menu.spec.js | 38 ++++++++++++++++++++++++++++
 packages/tag/Tag.vue                 |  8 ++++--
 4 files changed, 46 insertions(+), 4 deletions(-)

diff --git a/examples/docs/zh-CN/tag.md b/examples/docs/zh-CN/tag.md
index 7f742cdfa..8e914b8fa 100644
--- a/examples/docs/zh-CN/tag.md
+++ b/examples/docs/zh-CN/tag.md
@@ -105,7 +105,7 @@
       })
       const saveTagInput = ref(null)
       const handleClose = (tag) => {
-        state.dynamicTags.splice(state.dynamicTags.indexOf(tag), 1)
+        // state.dynamicTags.splice(state.dynamicTags.indexOf(tag), 1)
       }
       const showInput = () => {
         state.inputVisible = true
diff --git a/examples/versions.json b/examples/versions.json
index 615c8f31e..075c8c1c5 100644
--- a/examples/versions.json
+++ b/examples/versions.json
@@ -1 +1 @@
-{"1.4.13":"1.4","2.0.11":"2.0","2.1.0":"2.1","2.2.2":"2.2","2.3.9":"2.3","2.4.11":"2.4","2.5.4":"2.5","2.6.3":"2.6","2.7.2":"2.7","2.8.2":"2.8","2.9.2":"2.9","2.10.1":"2.10","2.11.1":"2.11","2.12.0":"2.12","0.0.24":"2.13"}
\ No newline at end of file
+{"1.4.13":"1.4","2.0.11":"2.0","2.1.0":"2.1","2.2.2":"2.2","2.3.9":"2.3","2.4.11":"2.4","2.5.4":"2.5","2.6.3":"2.6","2.7.2":"2.7","2.8.2":"2.8","2.9.2":"2.9","2.10.1":"2.10","2.11.1":"2.11","2.12.0":"2.12","0.0.25":"2.13"}
\ No newline at end of file
diff --git a/packages/menu/__tests__/Menu.spec.js b/packages/menu/__tests__/Menu.spec.js
index c11d7f936..4cf92a357 100644
--- a/packages/menu/__tests__/Menu.spec.js
+++ b/packages/menu/__tests__/Menu.spec.js
@@ -4,6 +4,18 @@ import Submenu from '../Submenu.vue'
 import MenuItemGroup from '../MenuItemGroup.vue'
 import { mount } from '@vue/test-utils'
 import { nextTick } from 'vue'
+import { createRouter, createWebHistory } from 'vue-router'
+const Home = { template: '<div>Home</div>' }
+const About = { template: '<div>About</div>' }
+const routes = [
+  { path: '/', component: Home },
+  { path: '/about', component: About }
+]
+const router = createRouter({
+  // 4. Provide the history implementation to use. We are using the hash history for simplicity here.
+  history: createWebHistory(),
+  routes // short for `routes: routes`
+})
 
 const components = {
   ElMenu: Menu,
@@ -411,5 +423,31 @@ describe('Menu.vue', () => {
       await wrapper.setProps({ defaultActive: '3' })
       expect(wrapper.find('.el-menu-item.is-active').text()).toContain('year')
     })
+    it('mode is route', async () => {
+      const C = {
+        template: `
+          <el-menu router>
+            <el-menu-item index="/">处理中心</el-menu-item>
+            <el-menu-item index="/about">消息中心</el-menu-item>
+          </el-menu>
+          <div class="example">
+            <router-view />
+          </div>
+          
+        `,
+        components
+      }
+      router.push('/')
+      await router.isReady()
+      const wrapper = mount(C, {
+        global: {
+          plugins: [router]
+        }
+      })
+      await wrapper.find('.el-menu-item').trigger('click')
+      expect(wrapper.find('.example').html()).toContain(
+        '<div class="example"><div>Home</div></div>'
+      )
+    })
   })
 })
diff --git a/packages/tag/Tag.vue b/packages/tag/Tag.vue
index a924028aa..d39fcb2ef 100644
--- a/packages/tag/Tag.vue
+++ b/packages/tag/Tag.vue
@@ -1,5 +1,5 @@
 <script lang="jsx">
-import { computed, getCurrentInstance, Transition } from 'vue'
+import { computed, getCurrentInstance, Transition, reactive } from 'vue'
 export default {
   name: 'ElTag',
   props: {
@@ -20,11 +20,13 @@ export default {
   },
   emits: ['close', 'click'],
   setup(props, { emit, slots }) {
+    const state = reactive({ show: true })
     const tagSize = computed(() => {
       return props.size || (getCurrentInstance().proxy.$ELEMENT || {}).size
     })
     const handleClose = (event) => {
       event.stopPropagation()
+      state.show = false
       emit('close', event)
     }
     const handleClick = (event) => {
@@ -53,7 +55,9 @@ export default {
       return props.disableTransitions ? (
         tagEl
       ) : (
-        <Transition name="el-zoom-in-center">{tagEl}</Transition>
+        <Transition name="el-zoom-in-center">
+          {state.show ? tagEl : ''}
+        </Transition>
       )
     }
   }