VEUI

VEUI on GitHub
English

ConfigProvider 配置器

示例

配置占位符

请选择协议1
在 GitHub 上编辑此示例编辑
<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

属性

名称类型默认值描述
valueObject-向其后代组件提供的配置值。

插槽

名称描述
default需要接收配置的内容,其中 VEUI 的组件会响应对应的配置值。
在 GitHub 上编辑此页面编辑
© Baidu, Inc. 2023