perf(switch): 新增 active-text inactive-text disabled 属性

This commit is contained in:
就眠仪式
2021-10-13 16:22:53 +08:00
parent 75d51b4ff8
commit 6f3a53f3e9
5 changed files with 132 additions and 8 deletions

View File

@@ -0,0 +1,106 @@
::: demo
<template>
<lay-switch v-model="active1"></lay-switch>
</template>
<script>
import { ref } from 'vue'
export default {
setup() {
const active1 = ref(true);
return {
active1
}
}
}
</script>
:::
::: demo
<template>
<lay-switch v-model="active2" @change="change"></lay-switch>
</template>
<script>
import { ref } from 'vue'
export default {
setup() {
const active2 = ref(true);
const change = function( val ) {
console.log("当前值:" + val)
}
return {
active2,
change
}
}
}
</script>
:::
::: demo
<template>
<lay-switch v-model="active3" :disabled="disabled"></lay-switch>
</template>
<script>
import { ref } from 'vue'
export default {
setup() {
const active3 = ref(true);
const disabled = ref(true)
return {
active3
}
}
}
</script>
:::
::: demo
<template>
<lay-switch v-model="active4" active-text="白天" inactive-text="夜间"></lay-switch>
</template>
<script>
import { ref } from 'vue'
export default {
setup() {
const active4 = ref(true)
return {
active4
}
}
}
</script>
:::
| Name | Description | Accepted Values |
| -------- | ---- | ----------------------- |
| name | 原生 name 属性 | -- |
| v-model | 是否启用 | `true` `false` |
| disabled | 禁用 | `true` `false` |
| change | 切换事件 | current : 当前值 | inactiveText
| active-text | 启用描述 | `启动` |
| inactive-text | 禁用描述 | `禁用` |

View File

@@ -293,6 +293,11 @@ export default {
title: '文本域',
subTitle: 'textarea',
path: '/zh-CN/components/textarea',
},{
id: 36,
title: '开关',
subTitle: 'switch',
path: '/zh-CN/components/switch',
}
]

View File

@@ -25,6 +25,6 @@ const plugins = [
.use(...createContainer('field', '描述信息'))
},
}),
]
] as any
export default plugins

View File

@@ -190,6 +190,10 @@ const zhCN = [
path: '/zh-CN/components/textarea',
component: () => import('../../docs/zh-CN/components/textarea.md'),
meta: { title: '文本域' },
},{
path: '/zh-CN/components/switch',
component: () => import('../../docs/zh-CN/components/switch.md'),
meta: { title: '开关' },
},
],
},