element ui 步骤条和tab标签

最新推荐文章于 2023-09-07 16:16:25 发布

xx820702

最新推荐文章于 2023-09-07 16:16:25 发布

阅读量334

点赞数

分类专栏： vue2 element ui 文章标签： elementui vue.js

本文链接：https://blog.csdn.net/xx820702/article/details/125018611

版权

vue2 同时被 2 个专栏收录

63 篇文章 1 订阅

订阅专栏

element ui

22 篇文章 0 订阅

订阅专栏

 <!-- 步骤条 -->
      <el-steps
        :space="200"
        :active="activeIndex-0"
        finish-status="success"
        align-center
      >
        <el-step title="基本信息"></el-step>
        <el-step title="商品参数"></el-step>
        <el-step title="商品属性"></el-step>
        <el-step title="商品图片"></el-step>
        <el-step title="商品内容"></el-step>
        <el-step title="完成"></el-step>
      </el-steps>
      <!-- tab区域 -->
      <el-tabs v-model="activeIndex" :tab-position="'left'" style="height: 200px">
        <el-tab-pane name="0" label="基本信息">基本信息</el-tab-pane>
        <el-tab-pane name="1" label="商品参数">商品参数</el-tab-pane>
        <el-tab-pane name="2" label="商品属性">商品属性</el-tab-pane>
        <el-tab-pane name="3" label="商品图片">商品图片</el-tab-pane>
        <el-tab-pane name="4" label="商品内容">商品内容</el-tab-pane>
      </el-tabs>




data() {
    return {
      activeIndex: "0",
    }
  },