refactor(menu): remove delayed-padding-left

src/menu/src/MenuItem.vue

@@ -15,7 +15,7 @@
     >
       <template #trigger>
         <n-menu-item-content
-          :padding-left="delayedPaddingLeft"
+          :padding-left="paddingLeft"
           :max-icon-size="maxIconSize"
           :active-icon-size="activeIconSize"
           :title="title"

src/menu/src/MenuItemGroup.js

@@ -29,7 +29,7 @@ export default defineComponent({
           'span',
           {
             class: 'n-menu-item-group-title',
-            style: `padding-left: ${this.delayedPaddingLeft}px;`
+            style: `padding-left: ${this.paddingLeft}px;`
           },
           [
             h(render, {

src/menu/src/Submenu.js

@@ -1,4 +1,4 @@
-import { h, withDirectives, vShow, ref, defineComponent } from 'vue'
+import { h, ref, defineComponent } from 'vue'
 import { NFadeInExpandTransition } from '../../_base'
 import { NDropdown } from '../../dropdown'
 import NMenuItemContent from './MenuItemContent.vue'
@@ -89,7 +89,7 @@ export default defineComponent({
   render () {
     const createSubmenuItem = () => {
       const {
-        delayedPaddingLeft,
+        paddingLeft,
         collapsed,
         mergedDisabled,
         maxIconSize,
@@ -103,7 +103,7 @@ export default defineComponent({
         dropdownShow
       } = this
       return h(NMenuItemContent, {
-        paddingLeft: delayedPaddingLeft,
+        paddingLeft,
         collapsed,
         disabled: mergedDisabled,
         maxIconSize,
@@ -121,16 +121,15 @@ export default defineComponent({
       return h(NFadeInExpandTransition, null, {
         default: () => {
           const { tmNodes, collapsed } = this
-          return withDirectives(
-            h(
+          return !collapsed
+            ? h(
               'div',
               {
                 class: 'n-submenu-children'
               },
               tmNodes.map((item) => itemRenderer(item))
-            ),
-            [[vShow, !collapsed]]
-          )
+            )
+            : null
         }
       })
     }

src/menu/src/menu-child-mixin.js

@@ -1,5 +1,3 @@
-import { nextTick } from 'vue'
-
 export default {
   inject: {
     NMenu: {
@@ -30,21 +28,6 @@ export default {
       default: undefined
     }
   },
-  data () {
-    return {
-      delayedPaddingLeft: undefined
-    }
-  },
-  created () {
-    this.delayedPaddingLeft = this.paddingLeft
-  },
-  watch: {
-    paddingLeft (value) {
-      nextTick(() => {
-        this.delayedPaddingLeft = value
-      })
-    }
-  },
   computed: {
     horizontal () {
       return this.NMenu.mode === 'horizontal'

src/menu/src/styles/index.cssr.js

@@ -257,7 +257,7 @@ export default cB('menu', {
       padding: 0
     }, [
       fadeInHeightExpandTransition({
-        duration: '.2s'
+        duration: '.3s'
       })
     ])
   ]),