6.7、Vue Select

Vue Select 简介

Vue Select是功能丰富的选择/下拉/预输入组件。它提供了适合大多数用例的默认模板，用于可过滤的选择下拉列表。该组件设计为尽可能轻巧，同时保持了可访问性，开发人员体验和自定义的高标准。

https://vue-select.org/

功能

• 标记
• 筛选/搜索
• Vuex支持
• AJAX支持
• SSR支持
• 无障碍
• 总计〜20kb /约5kb CSS /约15kb JS
• 选择单个/多个选项
• 可自定义广告位和SCSS变量
• 零依赖

Vue Select 在 Vue 中的使用

yarn add vue-select

# or, using NPM
npm install vue-select

然后，导入并注册该组件：

import Vue from 'vue'
import vSelect from 'vue-select'

Vue.component('v-select', vSelect)

该组件本身不包含任何CSS。您需要单独包含它：

import 'vue-select/dist/vue-select.css';

另外，您可以导入scss以完全控制组件样式：

@import "vue-select/src/scss/vue-select.scss";