Merge pull request #9 from wanli-song/develop

fix(menu)

packages/common/Menu/src/subMenu.vue

@@ -20,7 +20,10 @@
       <span>{{ title }}</span>
     </div>
     <fade-in-height-expand-transition>
-      <ul v-if="!isCollapsed" class="n-sub-menu-content">
+      <ul
+        v-if="!isCollapsed"
+        class="n-sub-menu-content"
+      >
         <slot />
       </ul>
     </fade-in-height-expand-transition>
@@ -61,11 +64,6 @@ export default {
       default: false
     }
   },
-  data () {
-    return {
-      isCollapsed: true
-    }
-  },
   computed: {
     hasIcon () {
       return this.NMenu.haIcon && this.$parent.$options.name === 'NMenu'
@@ -79,30 +77,17 @@ export default {
     },
     openNames () {
       return this.NMenu.openNames || this.NMenu.defaultOpenNames
+    },
+    isCollapsed () {
+      return !this.openNames.includes(this.name)
     }
   },
-  watch: {
-    openNames (value) {
-      this.setCollapsed()
-    }
-  },
-  mounted () {
-    this.setCollapsed()
-  },
   methods: {
     handleClick () {
       if (!this.disabled) {
-        this.isCollapsed = !this.isCollapsed
         this.NMenu.openKeysChangeCallback(this.name)
         this.$emit('click', this)
       }
-    },
-    setCollapsed () {
-      if (this.openNames && this.openNames.includes(this.name)) {
-        this.isCollapsed = false
-      } else {
-        this.isCollapsed = true
-      }
     }
   }
 }

styles/Menu.scss

@@ -57,7 +57,7 @@ $layout-nav-height: 64px;
               top: 0;
               bottom: 0;
               z-index: 0;
-              transition: opacity 0.3s $--n-ease-in-out-cubic-bezier;
+              transition: opacity 0.3s $--n-ease-in-out-cubic-bezier, background-position .3s $--n-ease-in-out-cubic-bezier;
               opacity: 0;
             }
             @include m(selected) {
@@ -132,7 +132,6 @@ $layout-nav-height: 64px;
         padding: 0;
         @include fade-in-height-expand-transition();
       }
-      
     }
     @include b(menu-item-group) {
       @include b(menu-item-group-title) {