ConfigProvider 配置器
示例
配置 Select
的 placeholder
可选的尺寸 ui
属性值:s
/m
。
请选择协议1
<template>
<article>
<veui-button
style="margin-right: 8px;"
@click="toggle"
>切换</veui-button>
<veui-config-provider :value="value">
<veui-select
:options="options"
clearable
/>
</veui-config-provider>
</article>
</template>
<script>
import { Select, ConfigProvider, Button } from 'veui'
const PLACEHOLDER1 = '请选择协议1'
const PLACEHOLDER2 = '请选择协议2'
// Select 的 placeholder 会响应配置 `select.placeholder`
export default {
components: {
'veui-config-provider': ConfigProvider,
'veui-select': Select,
'veui-button': Button
},
data () {
return {
value: {
'select.placeholder': PLACEHOLDER1
},
options: [
{
label: 'MIT',
value: 'mit'
},
{
label: 'BSD',
value: 'bsd'
}
]
}
},
methods: {
toggle () {
let prev = this.value['select.placeholder']
this.value['select.placeholder'] = prev === PLACEHOLDER1
? PLACEHOLDER2
: PLACEHOLDER1
}
}
}
</script>
API
属性
名称 | 类型 | 默认值 | 描述 |
---|---|---|---|
value | Object | - | 向其后代组件提供的配置值。 |
插槽
名称 | 描述 |
---|---|
default | 直接渲染出来,其中 VEUI 的组件会响应对应的配置值。 |