在使用element-ui的导航组件时遇到的bug，elmenu.items的key值不对的问题

在使用element-ui的导航组件时遇到的bug，elmenu.items的key值不对的问题

如果我们在页面布局的时候使用的是这样的布局，主菜单向子菜单传递的时候，element页面渲染没有问题，当加上process这种tab标签，并且点击这个tab标签相应的子菜单要激活，这个bug就来了。

原因是elment组件在设置items的时候莫名其妙的更新错了，保留了之前的key值，items里面的这个key值是用组件上绑定的index值设定的，激活态activeIndex也和这个key有关。

这时候只能自己手动改过来。

1.先给这个el-menu一个ref

<div class="whr-side-menu">
				<el-menu
					ref="aside_menu"
					class="el-menu-vertical-demo"
					:default-active="$route.path"
				>
					<menutree :menu="somenu"></menutree>
				</el-menu>
			</div>

2.点击主菜单的时候，把子菜单（children）传递给侧边栏子菜单。

1.somenu就是这个传递的值，讲道理的话，应该到此就完事了。谁也想不到会产生那个莫名其妙的bug。

2.把正确的key值手动付给items，就是下面的代码，用这个$set()我注释的那一段也可以，不过没必要，因为activeIndex依然不会变（之后会讲到）。

toSideMenu(children) {
			let that = this;
			this.somenu = children;
			let keymap = new Map();
			setTimeout(function () {
				for (let iterator in that.$refs.aside_menu.items) {
					keymap.set(
						iterator,
						that.$refs.aside_menu.items[iterator].index
					);
					// that.$set(
					// 	that.$refs.aside_menu.items,
					// 	keymap.get(iterator),
					// 	that.$refs.aside_menu.items[iterator]
					// );
					that.$refs.aside_menu.items[keymap.get(iterator)] =
						that.$refs.aside_menu.items[iterator];
					delete that.$refs.aside_menu.items[iterator];
				}
			}, 200);
		},

3.手动给activeIndex赋值，改变侧边栏导航的激活态

PubSub.subscribe("setAciveIndex", (msg, item) => {
			that.$set(that.$refs.aside_menu, "activeIndex", item);
		});

item就是对应的路由

好了，这样就解决了。这个bug我解决了好久，开始以为自己传值有问题，可是这么简单点事能出什么问题呢？

不过后面我要讲的，手动渲染递归导航菜单可以避开的这个问题。

后面讲vue element-ui 导航菜单的递归渲染。