iView Weapp的步驟條
這個步驟條真是個好組件,效果如下:
代碼如下:
<i-steps>
<i-step status="finish" icon="barrage">
<view slot="title">
已完成
</view>
<view slot="content">
這里是該步驟的描述信息
</view>
</i-step>
<i-step status="process" icon="brush">
<view slot="title">
進行中
</view>
<view slot="content" icon="camera">
這里是該步驟的描述信息
</view>
</i-step>
<i-step icon="collection">
<view slot="title">
錯誤
</view>
<view slot="content">
這里是該步驟的描述信息
</view>
</i-step>
</i-steps>
使用說明:
Steps
屬性
current
當前步驟, 從0 開始計數status
當前狀態, 可選值為 wait、process、finish、errordirection
步驟條的方向,可選值為 horizontal(水平)或 vertical(垂直)
Step
status
步驟的狀態,可選值為 wait、process、finish、error,不設置時自動判斷title
步驟的標題content
步驟的詳細描述,可選icon
步驟的圖標,可選
測試發現一個很尷尬的點: i-step
使用icon
屬性時,模擬器演示時圖標沒有居中顯示,有點偏下,看起來怪怪的,真機看了下又是正常的
不管怎樣,先存下來,看后面用不用的着