zoukankan      html  css  js  c++  java
  • element-ui的tabs默认选中页签

    Element-UI提供了tabs组件(选项卡、多页签),其中在tabs的属性中提供了一个value/v-model属性来绑定默认选中的页签。

    我们通过简单的示例来看一下具体是怎么使用的。

    <template>
      <el-tabs v-model="activeTab" @tab-click="tabClick">
        <el-tab-pane label="我爱你" name="yanggb1">我爱你</el-tab-pane>
        <el-tab-pane label="我好爱你" name="yanggb2">我好爱你</el-tab-pane>
        <el-tab-pane label="我超爱你" name="yanggb3">我超爱你</el-tab-pane>
        <el-tab-pane label="我真的爱你" name="yanggb4">我真的爱你</el-tab-pane>
      </el-tabs>
    </template>

    这里我将v-model的属性值设置为activeTab,接下来就可以在JavaScript中对这个属性值进行数据绑定。

    export default {
        data() {
            return {
                activeTab: 'yanggb2'
            };
        }
    };

    这样,在初始化页面的时候,就会默认选中第二个页签了。

    "我不能悲伤地呆在你身旁。"

  • 相关阅读:
    monitor system
    monitor disk
    manage account
    windows
    backup daily
    shell 脚本编程概述
    OGNL表达式
    Struts2各个功能详解(2)-输入校验和拦截器
    struts2各个功能详解(1)----参数自动封装和类型自动转换
    Struts2源码解析2
  • 原文地址:https://www.cnblogs.com/yanggb/p/11422529.html
Copyright © 2011-2022 走看看