在vue項目中，使用elementui 框架，做一個后臺管理系統(tǒng)
在寫左邊菜單，菜用了，elementui 提供的組件 ， el-menu 組件。但是組件沒有鏈接，而我們知道添加鏈接使用router-link標(biāo)簽代碼如下：

<el-menu-item :key="index" v-if="item.menuChilds.length==0" :index="item.menuUrl" ><i v-if="item.menuImgClass" :class="item.menuImgClass"></i><router-link :to="item.menuUrl"><span slot="title">pw_item.menuName</span></router-link></el-menu-item>

在span外包了一個router-link ， 鏈接沒有問題，但是樣式就出現(xiàn)問題了

最后終于發(fā)現(xiàn)了，不用加router-link, 官網(wǎng)給出了使用方法

在el-menu 標(biāo)簽中，添加router屬性（:router=“true” 或者直接 ）

綁定index 為要跳轉(zhuǎn)的路由，即可以進(jìn)行正常的跳轉(zhuǎn)，并且樣式正常

<el-menu :default-active="$route.path" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose":collapse="isCollapse" router><template v-for="(item,index) in menulist" ><!--沒有子菜單--><el-menu-item :key="index" v-if="item.menuChilds.length==0" :index="item.menuUrl" ><i v-if="item.menuImgClass" :class="item.menuImgClass"></i><span slot="title">pw_item.menuName</span></el-menu-item>

總結(jié)

以上是生活随笔為你收集整理的element ui 中 el-menu 如何添加链接router-link标签的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。