0.0.5 • Published 1 year ago
meixistepbar v0.0.5
meixiStepBar
用于业务当中展示步骤进度条。
项目结构
|-- lib ---------------------------插件打包后文件夹
| |-- demo.html
| |-- meixistepbar.common.js
| |-- meixistepbar.umd.js
| |-- meixistepbar.umd.min.js
|-- packages ---------------------------插件主要文件夹
| |-- index.ts ---------------------------入口文件
| |-- component ---------------------------组件文件夹
| |-- meixiStepBar.vue ---------------------------主要组件
| |-- stepBarItem.vue
|-- public
| |-- favicon.ico
| |-- index.html
|-- src组件预览
安装依赖
npm install meixiStepBar项目文件
/// index.ts
// 入口只导出 meixiHandleRecord 组件
export {meixiStepBar}插件使用
<meixi-step-bar v-model='activityStep'
:error='errorIndex'
:error-text='orderInfo.verifyRemark '
:step-list='listStep'>
</meixi-step-bar>meixiStepBar Api
props
| 参数 | 类型 | 默认值 | 可选值 | 描述 |
|---|---|---|---|---|
| v-model | / | / | / | 当前被选中的数组下标 |
| size | String | mini | mini | 进度步骤条的大小 |
| stepList | Array | / | / | 总共需要渲染的步骤列表，类型为{title:'第一步'} |
| space | String | / | / | 单条步骤的宽度 |
| event | Boolean | false | true/false | 单条步骤是否开启点击事件,并且修改v-model为点击的数组下标 |
| error | Number | 0 | 如果需要显示某一条步骤是否渲染成错误的样式可以修改成数组下标 | |
| errorText | String | 这是一段错误的描述 | 当鼠标hover错误的步骤时，悬浮出来的提示文字 |
emit 事件
暂无
slot 插槽
暂无