Element-UI 写后台【三】 让上面全部联通动起来

1、定义相关组件的路由

2、 在main.vue 使用<router-view></router-view>进行渲染

3、在Aside.vue中clickMenu，使用编程式导航进行跳转

methods: {
            clickMenu(item) {
                this.$router.push({name:item.name})
                this.$store.commit(‘selectMenu‘, item)
            }
        },

4、Tab联通性，与上类似

5、Tab需要加一个点击函数，让点击进行路由跳转

      <el-tag
                :key="tag.name"
                v-for="tag in tags"
                closable
                :disable-transitions="false"
                :closeable="tag.name !== ‘home‘"
                @click=‘changeMenu(tag)‘
                @close="handleClose(tag)">
            {{tag.label}}
        </el-tag>

   changeMenu(item) {
                this.$router.push({name: item.name})
                //    调用VUEX的方法
                this.$store.commit(‘selectMenu‘, item)
            }

 

地址 : https://github.com/njp2645509660/element-ui-.git