使用方法：（具體使用請參考 https://gitee.com/declanlc/step-all-device）
1、引入樣式
拉取項目后，里面包含一個`step-lc`文件夾，其中包含兩個文件，`step.js`和`step.css`，`step.css`可以放在你項目的任何靜態(tài)文件夾，然后要在使用分步表單的頁面引入這個`step.css`樣式即可，只要保證路徑正確，例如下面的：

# index.html
# 無論在哪個頁面使用分步表單
# 需要引入以下兩個樣式如：
<link href="./layui/css/layui.css" rel="stylesheet"/>
<link href="./step-lc/step.css" rel="stylesheet">
# 可以將 step.css 放入任何目錄，只要地址引用正確即可

2、引入腳本
假如你的項目當(dāng)中，`.js`文件全部放在`/static/js/`文件夾下面，此時第一步將拉取的`step-lc`目錄放到復(fù)制到里面，即`/static/js/step-lc`，然后在需要用到分步表單的頁面寫上如下：

<script>
layui.config({
    base:'./'
}).extend({
    step: 'step-lc/step'
}).use(['step'], () => {
    let step = layui.step
    step.run({
        // 參數(shù)配置...
    })
})
</script>

3、參數(shù)說明
a. elem: 一個DOM的id
b: stepWidth: 分步表單進度提示容器寬度，可以接受一個大小的寬度，如'18rem'、'500px'、500
c: contentWidth: 分步表單內(nèi)容的寬度，可以接受一個大小的寬度，如'18rem'、'500px'、500
d: contentHeight: 分步表單內(nèi)容的高度, 如'18rem'、'500px'、500
e: nodes: 分步表單的進度內(nèi)容提示，如：[{tip: '協(xié)議',},{tip: '信息',},{tip: '結(jié)果',}]
f: contents: 分步表單的內(nèi)容，每個數(shù)組項是一個對象，這個對象包含兩個字段，_tpl和ctx，_tpl是內(nèi)容的模板，ctx是這個模板里面要用到的各種方法和變量，具體用法參照示例的index.html

4、重要方法
a. prev: 可以手動調(diào)用 step.prev() 切換到上一屏
b. next: 可以手動調(diào)用 step.next() 切換到下一屏
c. getCurrent: 可以調(diào)用 step.getCurrent() 獲取當(dāng)前所在屏的序號
d. freshHeight: 組件本身是基于 carousel 封裝的，因為 carousel 默認高度是 280px 且只能設(shè)置固定值，當(dāng)填寫表單時，表單可能因為要提示消息而動態(tài)變高，在填寫完時調(diào)用此方法 step.freshHeight() 就可以達到高度自適應(yīng)的目的

PC端：




Iphone SE: