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

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

2、引入腳本
假如你的項(xiàng)目當(dāng)中，`.js`文件全部放在`/static/js/`文件夾下面，此時(shí)第一步將拉取的`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: 一個(gè)DOM的id
b: stepWidth: 分步表單進(jìn)度提示容器寬度，可以接受一個(gè)大小的寬度，如'18rem'、'500px'、500
c: contentWidth: 分步表單內(nèi)容的寬度，可以接受一個(gè)大小的寬度，如'18rem'、'500px'、500
d: contentHeight: 分步表單內(nèi)容的高度, 如'18rem'、'500px'、500
e: nodes: 分步表單的進(jìn)度內(nèi)容提示，如：[{tip: '協(xié)議',},{tip: '信息',},{tip: '結(jié)果',}]
f: contents: 分步表單的內(nèi)容，每個(gè)數(shù)組項(xiàng)是一個(gè)對(duì)象，這個(gè)對(duì)象包含兩個(gè)字段，_tpl和ctx，_tpl是內(nèi)容的模板，ctx是這個(gè)模板里面要用到的各種方法和變量，具體用法參照示例的index.html

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

PC端：




Iphone SE: