ant design vue 步骤条step加气泡卡片popover

阅读 96

2022-01-11

在官网的基础上做了点修改
官网:https://www.antdv.com/components/steps-cn/

<!--Step:当前步骤条所处的节点位置-->
<!--StepChange:点击改变步骤条的节点位置-->
<a-steps :current="Step" @change="onStepChange">
   <a-step v-for="(item, index) in Steps" :key="index" :title="item">
      <a-popover
            progress-dot
            slot="progressDot"
            :visible="visible"
            placement="top"
       >
       <!--气泡卡片的内容-->
         <template slot="content">
          <span>{{ title }}</span>
          <p>{{ content}}</p>
         </template>
       </a-popover>
    </a-step>
</a-steps>
...
Step: 0,
...
onStepChange(current) {
   this.Step = current
 },

在这里插入图片描述

精彩评论(0)

0 0 举报