iview 动态渲染menu时active-name无效的问题

Posted 2023-02-23

参考技术A 场景：Menu组件设置active-name属性无效。

原因：因为active-name 生效之后，menu是从接口请求回来的。这时候this.menus 被重新赋值，触发数据变更事件，menu组件又重新渲染。active-name应该只在初次加载时执行一次。

处理：

给Menu组件绑定ref，menu列表更新时，手动更新

  this.activeName = xxx

        this.openNames = [xxx]

        this.$nextTick(() => 

          this.$refs.menus.updateOpened()

          this.$refs.menus.updateActiveName()

        )