一个 Vue 组件
- 安装
npm i ls-component
- 全局注册
import ls-component from 'ls-component'
Vue.use(ls-component)
- 按需导入
import ls-component, { Button, Form } from 'ls-component'
Vue.use(ls-component, {
components: [Button, Form]
})
属性 | 值 | 描述 |
---|---|---|
type | String | 按钮类型:primary,info,success,warning,danger |
plain | Boolean | 是否为朴素按钮,默认为 false |
mimicry | Boolean | 是否为拟态按钮,和 plain 不能同时设置,会被 plain 覆盖。默认为 false |
disabled | Boolean | 是否禁用按钮,默认为 false |
round | Boolean | 是否为圆角按钮,默认为 false |
circle | Boolean | 是否为圆形按钮,默认为 false |
icon | Array 或 Boolean | font-awesome 字体数组,默认为 false |
事件 | 值 | 描述 |
---|---|---|
click | Function | 点击事件 |
属性 | 值 | 描述 |
---|---|---|
title | String | 对话框头部提示,默认为"提示" |
visiable | Boolean | 对话框可见状态,默认为 false |
width | String | 对话框宽度,默认为 60% |
top | String | 对话框距离顶部位置,默认为 15vh |
---
属性 | 值 | 描述 |
---|---|---|
placeholder | String | 占位符,默认为空字符串 |
type | String | 表单类型,默认为'text' |
name | String | 表单命名,默认为空 |
value | String | 表单值,默认为空字符串 |
disabled | Boolean | 是否禁用,默认为 false |
属性 | 值 | 描述 |
---|---|---|
name | String | 表单命名,默认为空 |
value | String | 表单值,默认为空字符串 |
disabled | Boolean | 是否禁用,默认为 false |
activeColor | String | 激活状态颜色,默认为#dcdfe6 |
inactiveColor | String | 未激化状态颜色,默认为#dcdfe6 |
事件 | 值 | 描述 |
---|---|---|
change | Function | 状态修改触发事件,返回修改后的状态 |
属性 | 值 | 描述 |
---|---|---|
label | [String, Number, Boolean] | 单选框 label 值,默认为空字符串 |
name | String | 表单命名,默认为空 |
value | String | 表单值,默认为空字符串 |
color | String | 单选框选择时的颜色,默认为#409eff |
用于包裹 radio,通过 v-model 指定组内所有的 radio 的 v-model
属性 | 值 | 描述 |
---|---|---|
label | [String, Number, Boolean] | 单选框 label 值,默认为空字符串 |
name | String | 表单命名,默认为空 |
value | String | 表单值,默认为空字符串 |
color | String | 单选框选择时的颜色,默认为#409eff |
用于包裹多个 checkbox,通过 v-model 指定组内所有的 checkout 的 v-model