vue使用elementUI導航vue-router解決高亮問題


代碼總覽:

<template>
<div>
                  <el-aside width="190px" style="overflow:hidden" >
                        <el-row class="tac">
                        <el-col :span="12">
                            <el-menu
                            :default-active="activenev"
                            class="el-menu-vertical-demo"
                            background-color="#2d3438"
                            text-color="#fff"
                            style="height:974px;"
                            :router="true"
                            :collapse="false"	
                            :default-openeds="defaarray"
                          
                            >
                            <el-submenu index="1">
                                <template slot="title">
                                <i class="el-icon-location"></i>
                                <span>控制台</span>
                                </template>
                                  <el-menu-item index="server">    
                                      <i class="el-icon-upload"></i>
                                            雲服務器</el-menu-item>
                                  <el-menu-item index="db">  
                                            <i class="el-icon-tickets"></i>
                                            雲數據庫
                                   </el-menu-item>
                                     <el-menu-item index="domain">  
                                        <i class="el-icon-loading"></i>
                                         智能負載均衡
                                      </el-menu-item>
                                      <el-menu-item index="1-2-1">  
                                            <i class="el-icon-rank"></i>
                                            域名
                                     </el-menu-item>
                            </el-submenu>
                            <el-submenu index="2">
                                <template slot="title">
                                <i class="el-icon-view"></i>
                                <span>用戶中心</span>
                                </template>
                                 <el-menu-item index="1-2-1">  
                                            <i class="el-icon-view"></i>
                                            財務中心
                                    </el-menu-item>
                     
                                 <el-menu-item index="1-2-1">  
                                            <i class="el-icon-refresh"></i>    
                                            續費管理
                          
                                    </el-menu-item>
                        
                                 <el-menu-item index="1-2-1">  
                                            <i class="el-icon-service"></i>
                                            工單管理
                               </el-menu-item>
              
                               <el-menu-item index="1-2-1">      
                                            <i class="el-icon-setting"></i>
                                            賬號設置
                                </el-menu-item>
                            </el-submenu>
                            </el-menu>
                        </el-col>
                        </el-row>

                 </el-aside>
</div>
</template>
<script>
export default {
    data(){
        return{
            activenev:'',
            defaarray:["1","2"]
        }
    },
 methods:{ splithref(href){ var href = href.split("http://localhost:8080/user/") console.log(href[1]) return href[1] } }, mounted(){ this.activenev = this.splithref(window.location.href) },
}
</script>

  


 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM