在 b-form-select 中看不到 API 的价值 - Vue.js

Posted

技术标签:

【中文标题】在 b-form-select 中看不到 API 的价值 - Vue.js【英文标题】:Can't see value from API in b-form-select - Vue.js 【发布时间】:2020-05-30 16:33:05 【问题描述】:

我使用 API 来获取用户。我希望将这些用户绑定到 b-form-select (bootstrap-vue)。但在请求后,我在 b-form-select 中看到“null”。我的要求

getAllUsers() 
                axios.get('/GetUsers')
                    .then(res => 
                        this.funds = res.data
                        console.log(this.options1)
                    )
            

显示数据的表格

<b-form-select
                        id="input-3"
                        v-model="userSelect"
                        :options="funds"
                        required
                ></b-form-select>

但是如果我使用

<select v-model="userSelect" class="form-control">
                <option v-for="user in funds" :key="user.id" :value="user">user.name  user.id </option>
            </select>

我看到了我的用户。为什么 bootstrap-vue 不能显示我的数据?

【问题讨论】:

请添加minimal reproducible example。您当前发布的内容不足以重现,因此请调试您的问题。 【参考方案1】:

b--form-selectvalue 作为选项中 value 属性的默认字段,并将 text 字段作为标签。

如果您想自定义字段属性名称(例如使用名称字段显示文本),您可以通过将 text-field、html-field、value-field 和 disabled-field 属性设置为字符串来轻松更改它们包含您要使用的属性名称:

<b-form-select
       id="input-3"
        v-model="userSelect"
        :options="funds"
       value-field="name"
      text-field="name"
       required
></b-form-select>

【讨论】:

以上是关于在 b-form-select 中看不到 API 的价值 - Vue.js的主要内容,如果未能解决你的问题,请参考以下文章

KivyMD,在 android 中看不到图标,但在 linux 上工作

如何根据 b-form-select 中的选定值禁用/启用文本字段?

在 TestFlight 中看不到构建

在 UIActivityViewController 中看不到提醒应用选项

在 GitLab 注册表中看不到容器映像

在堆栈驱动程序中看不到跟踪