欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

vue如何給element-ui中的el-tabs動態(tài)設(shè)置label屬性

 更新時間：2022年08月10日 14:21:11   作者：_仰望星空的你  
這篇文章主要介紹了vue如何給element-ui中的el-tabs動態(tài)設(shè)置label屬性，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教

給element-ui中的el-tabs動態(tài)設(shè)置label屬性

效果：

代碼：

<template>
? <div class="login">
? ? <el-tabs v-model="activeName">
? ? ? <el-tab-pane :label="'用戶管理（'+name+')'" name="1">用戶管理</el-tab-pane>
? ? ? <el-tab-pane label="配置管理" name="2">配置管理</el-tab-pane>
? ? ? <el-tab-pane label="角色管理" name="3">角色管理</el-tab-pane>
? ? ? <el-tab-pane label="定時任務(wù)補償" name="4">定時任務(wù)補償</el-tab-pane>
? ? </el-tabs>
? </div>
</template>
<script>
export default {
? data() {
? ? return {
? ? ? name:'10',
? ? ? activeName: "1",
? ? };
? },
? methods: {
? ??
? },
};
</script>

關(guān)于element-ui-tabs標(biāo)簽的基本使用

?<el-tabs v-model="activeName" @tab-click="handleClick">
? ? <el-tab-pane label="用戶管理" name="first">用戶管理</el-tab-pane>
? ? <el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
? ? <el-tab-pane label="角色管理" name="third">角色管理</el-tab-pane>
?</el-tabs>
?
// v-model="activeName" activeName 與<el-tab-pane>標(biāo)簽中的name屬性的值相互綁定，綁定上的值為頁面默認(rèn)展示的項
?
// label 為展示在頁面的標(biāo)簽名
?
// @tab-click="handleClick" tab 被選中時觸發(fā)，activeName 的值也會隨之更改，返回值為 name
?
// 點擊對應(yīng)標(biāo)簽內(nèi)容的顯示寫在<el-tab-pane>標(biāo)簽中

此標(biāo)簽作用類似于導(dǎo)航欄，設(shè)置完導(dǎo)航欄標(biāo)題和對應(yīng)屬性后，把想要展示的其他頁面標(biāo)簽寫入

<el-tab-pane>標(biāo)簽中，通過對應(yīng)的點擊事件來控制切換展示不同頁面 

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。 

相關(guān)文章

最新評論