element-ui 步骤条和标签页绑定

Posted huang131

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了element-ui 步骤条和标签页绑定相关的知识,希望对你有一定的参考价值。

绑定过程中须进行字符串和数字转换

<el-card>
      <el-alert title="修改商品信息" type="info" :closable="false" center show-icon></el-alert>
      <el-steps :space="200" :active="activeIndex - 0" align-center finish-status="success">
        <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>
      <el-tabs :tab-position="tabPosition" style="height: 200px;" tabPosition="left"  v-model="activeIndex">
        <el-tab-pane label="基本信息" name="0">基本信息</el-tab-pane>
        <el-tab-pane label="商品参数" 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="商品内容" name="4">定时任务补偿</el-tab-pane>
      </el-tabs>
    </el-card>
在进行字符串转数字时,activeIndex须用"activeIndex - 0",+0出错

以上是关于element-ui 步骤条和标签页绑定的主要内容,如果未能解决你的问题,请参考以下文章

vue2 ElementUI 表单标签表格表头添加问号图标提示

vue element-ui Tabs 标签页实现更多功能

升级element-ui后,tabs标签页导致页面卡死

VUE仿造element-ui el-tabs标签页选项卡样式

Element-ui中 表单(Form)校验的几种形式 及 表单嵌套表格含上传(Upload)组件的

在vue2.0中引用element-ui组件库