Ant-design-vue: menu菜单打开下级的时候会顿一下

[zboMa]

• [ ] I have searched the issues of this repository and believe that this is not a duplicate.

Version

1.3.10

Environment

随便什么环境，官网示例就能测出来

Reproduction link

https://vue.ant.design/components/menu-cn/

Steps to reproduce

打开官网，搜索menu，点击示例侧边栏打开随便一个

What is expected?

内存div，li里面的那个class为ant-menu-submenu-title的那个，margin-top去掉。

What is actually happening?

1 内层div给了top和bottom的margin各4px
2 但是因为div外面就是li，所以div的margin被计算给了li
3 而li的bottom和下一个li的top重叠了
4 此时如果打开这个li，则因为加载子级目录的原因，margin-bottom重新计算给了div，于是高度突然会多处4px，之后才会开始子级展示动画
5 由此造成的类似卡顿体验，令人苦恼
6 希望改进，建议是去掉margin-top。这样既不会丢失原来的期望，也可以解决卡顿问题。唯一的改变是整体ul会少一个margin-top： 4px。

---

没了。

[iswangaiguo]

同样的困惑

[ZhaoAndQian]

在性能不高的电脑中比较明显，给人感觉很卡一样

[iswangaiguo]

在性能不高的电脑中比较明显，给人感觉很卡一样

看来是我电脑性能不行。。。

[ZhaoAndQian]

我自己用的开发电脑打开也有一点卡顿，老板的电脑是旧电脑打开要等上估计1秒

[vvizden]

同样的苦恼，怎么解决呢

[zboMa]

解决方案第6条已经给了，我不知道官方解决了吗，我是直接覆盖了样式。

.ant-menu-submenu:first-of-type {
  margin-top: 4px;
}
.ant-menu-submenu-title {
  margin-top: 0;
}

[vvizden]

解决方案第6条已经给了，我不知道官方解决了吗，我是直接覆盖了样式。

.ant-menu-submenu:first-of-type {
  margin-top: 4px;
}
.ant-menu-submenu-title {
  margin-top: 0;
}

感谢，目前官方还存在这个问题。我对比react，按照你给的样式覆盖后，发现还是没有react般丝滑

[tangjinzhou]

ref https://github.com/ant-design/ant-design/issues/19477