element/packages/switch/README.md

59 lines
1.6 KiB
Markdown
Raw Normal View History

2016-12-15 07:15:46 +00:00
# element-switch
> A element-switch component for Vue.js.
2016-07-27 06:15:02 +00:00
## Installation
```shell
2016-12-15 07:15:46 +00:00
npm i element-switch -D
2016-07-27 06:15:02 +00:00
```
## Usage
```javascript
import Vue from 'vue'
2016-12-15 07:15:46 +00:00
import ElSwitch from 'element-switch'
2016-07-27 06:15:02 +00:00
import 'element-theme-default'
Vue.use(ElSwitch)
```
or
```javascript
import Vue from 'vue'
2016-12-15 07:15:46 +00:00
import ElSwitch from 'element-switch'
2016-07-27 06:15:02 +00:00
Vue.component('el-switch', ElSwitch)
```
2016-12-15 07:15:46 +00:00
### Attributes
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---------- |-------- |---------- |------------- |-------- |
| disabled | 是否禁用 | boolean | — | false |
| width | switch 的宽度(像素) | number | — | 58有文字/ 46无文字 |
| on-icon-class | switch 打开时所显示图标的类名,设置此项会忽略 `on-text` | string | — | — |
| off-icon-class | switch 关闭时所显示图标的类名,设置此项会忽略 `off-text` | string | — | — |
| on-text | switch 打开时的文字 | string | — | ON |
| off-text | switch 关闭时的文字 | string | — | OFF |
| on-color | switch 打开时的背景色 | string | — | #20A0FF |
| off-color | switch 关闭时的背景色 | string | — | #C0CCDA |
| name | switch 对应的 name 属性 | string | — | — |
### Events
| 事件名称 | 说明 | 回调参数 |
|---------- |-------- |---------- |
| change | switch 状态发生变化时的回调函数 | 新状态的布尔值 |
2016-07-27 06:15:02 +00:00
## Development
```shell
make dev
## test
make test
## build
make build
```
# License
[MIT](https://opensource.org/licenses/MIT)