Select组件 jb-select

jb-select组件是在NaiveUI的Select组件基础上扩展的一个组件，所以NaiveUI中支持的属性在jb-select中都可以使用。 jb-select做了以下扩展：

支持配置url请求地址，自动发起请求获取选项列表。
结合jbolt框架，labelField属性值默认值设为text，valueField属性默认值设为value。

Props

名称	类型	默认值	说明
url	string	`undefined`	组件加载时自动向`url`发起请求。

示例

最简单的用法

vue

<jb-select
    v-model:value="form.posts"
    url="/api/admin/post/options"
></jb-select>

<jb-select
    v-model:value="form.posts"
    url="/api/admin/post/options"
></jb-select>

多选+过滤

vue

<jb-select
    v-model:value="form.posts"
    url="/api/admin/post/options"
    multiple
    filterable
></jb-select>

<jb-select
    v-model:value="form.posts"
    url="/api/admin/post/options"
    multiple
    filterable
></jb-select>

返回的数据不满足默认的labelField和valueField，可以自定义

vue

<jb-select
    v-model:value="form.posts"
    url="/api/admin/post/options"
    labelField="name"
    valueField="id"
    clearable
    filterable
></jb-select>

<jb-select
    v-model:value="form.posts"
    url="/api/admin/post/options"
    labelField="name"
    valueField="id"
    clearable
    filterable
></jb-select>

Select组件 jb-select ​

Props ​

示例 ​

Select组件 jb-select

Props

示例