查询网站旗下域名,贵阳搜索引擎排名推广,百度联盟怎么看广告赚钱,网校网站建设需求#xff1a;点击侧边导航栏#xff0c;右侧main对应显示
通过v-if或v-show等指令来控制不同内容的显示隐藏来实现
注意#xff1a;
使用v-if时候进行导航栏切换#xff0c;右侧显示区域可能会出现样式错乱#xff1b;使用v-show则不会出现此错误 template点击侧边导航栏右侧main对应显示
通过v-if或v-show等指令来控制不同内容的显示隐藏来实现
注意
使用v-if时候进行导航栏切换右侧显示区域可能会出现样式错乱使用v-show则不会出现此错误 template!-- Aside和Main区域 --el-containerel-asideel-menu :default-activeasideActiveIndex selecthandleAsideSelectel-menu-item indexbasic-info基本信息/el-menu-itemel-menu-item indextested-system被测系统/el-menu-item/el-menu/el-asideel-main!-- 通过v-if来控制不同内容的显示 --div v-ifcurrentAside basic-infobasic-info/divdiv v-ifcurrentAside tested-systemtested-system/div/el-main/el-container
/templatescript
export default {data() {return {asideActiveIndex: basic-info,currentAside: basic-info,};},methods: {handleAsideSelect(key, keyPath) {this.currentAside key;console.log(key, key);if (key /basic-info) {console.log(切换到基本信息选项卡);} else if (key /tested-system) {console.log(切换到样品清单选项卡);}},}
};
/script
