vant-weapp/example/pages/steps/index.wxml

<import src="/dist/steps/index.wxml" />

<view class="container">

  <view class="doc-title zan-hairline--bottom">STEPS</view>

  <view class="zan-panel">
    <view class="zan-cell">
      <view class="zan-cell__bd">
        <zan-steps type="horizon" steps="{{steps}}"></zan-steps>
      </view>
    </view>

    <view class="zan-cell">
      <view class="zan-cell__bd">
        <zan-steps type="horizon" steps="{{steps2}}"></zan-steps>
      </view>
    </view>

    <view class="zan-cell zan-cell--last-child">
      <view class="zan-cell__bd">
        <zan-steps type="horizon" steps="{{steps3}}"></zan-steps>
      </view>
    </view>
  </view>

  <view class="zan-panel-title">有描述的steps</view>
  <view class="zan-panel">
    <view class="zan-cell">
      <view class="zan-cell__bd">
        <zan-steps type="horizon" hasDesc steps="{{steps}}"></zan-steps>
      </view>
    </view>

    <view class="zan-cell">
      <view class="zan-cell__bd">
        <zan-steps type="horizon" hasDesc steps="{{steps2}}"></zan-steps>
      </view>
    </view>

    <view class="zan-cell zan-cell--last-child">
      <view class="zan-cell__bd">
        <zan-steps type="horizon" hasDesc steps="{{steps3}}"></zan-steps>
      </view>
    </view>
  </view>

  <view class="zan-panel-title">垂直方向的steps</view>
  <view class="zan-panel">
    <view class="zan-cell zan-cell">
      <view class="zan-cell__bd">
        <zan-steps type="vertical" hasDesc steps="{{steps}}"></zan-steps>
      </view>
    </view>

    <view class="zan-cell zan-cell--last-child">
      <view class="zan-cell__bd">
        <zan-steps type="vertical" steps="{{steps}}"></zan-steps>
      </view>
    </view>
  </view>

  <view class="zan-panel-title">可自定义class</view>
  <view class="zan-panel">
    <view class="zan-cell__bd">
      <zan-steps type="vertical" steps="{{steps}}" className="my-class"></zan-steps>
    </view>
  </view>

</view>