【发布时间】:2020-11-18 11:49:35
【问题描述】:
我有一个使用 bootstrap-vue 的选项列表,如图所示:
在选择窗口中看起来不错,但打开下拉菜单时并非所有图标都显示。选择图标后,它会显示:
即螺栓显示 [],但选择时:
图标栏代码:
<template v-slot:cell(icon)="row">
<b-form-select v-model="row.item.icon" class="fa">
<b-form-select-option value="anchor">  anchor</b-form-select-option>
<b-form-select-option value="angle-double-up">  angle-double-up</b-form-select-option>
<b-form-select-option value="angle-double-down">  angle-double-down</b-form-select-option>
<b-form-select-option value="angle-double-left">  angle-double-left</b-form-select-option>
<b-form-select-option value="angle-double-right">  angle-double-right</b-form-select-option>
<b-form-select-option value="angle-up">  angle-up</b-form-select-option>
<b-form-select-option value="angle-down">  angle-down</b-form-select-option>
<b-form-select-option value="angle-left">  angle-left</b-form-select-option>
<b-form-select-option value="angle-right">  angle-right</b-form-select-option>
<b-form-select-option value="archive">  archive</b-form-select-option>
<b-form-select-option value="asterisk">  asterisk</b-form-select-option>
<b-form-select-option value="at">  at</b-form-select-option>
<b-form-select-option value="automobile">  automobile</b-form-select-option>
<b-form-select-option value="balance-scale">  balance-scale</b-form-select-option>
<b-form-select-option value="ban">  ban</b-form-select-option>
<b-form-select-option value="bank">  bank</b-form-select-option>
<b-form-select-option value="bar-chart">  bar-chart</b-form-select-option>
<b-form-select-option value="barcode">  barcode</b-form-select-option>
<b-form-select-option value="battery-full">  battery-full</b-form-select-option>
<b-form-select-option value="bell">  bell</b-form-select-option>
<b-form-select-option value="binoculars">  binoculars</b-form-select-option>
<b-form-select-option value="bolt">  bolt</b-form-select-option>
<b-form-select-option value="book">  book</b-form-select-option>
<b-form-select-option value="bookmark">  bookmark</b-form-select-option>
<b-form-select-option value="briefcase">  briefcase</b-form-select-option>
<b-form-select-option value="building">  building</b-form-select-option>
<b-form-select-option value="calculator">  calculator</b-form-select-option>
<b-form-select-option value="bullseye">  bullseye</b-form-select-option>
<b-form-select-option value="bullhorn">  bullhorn</b-form-select-option>
<b-form-select-option value="calendar">  calendar</b-form-select-option>
<b-form-select-option value="camera-retro">  camera-retro</b-form-select-option>
<b-form-select-option value="car">  car</b-form-select-option>
<b-form-select-option value="certificate">  certificate</b-form-select-option>
<b-form-select-option value="chain">  chain</b-form-select-option>
<b-form-select-option value="chain-broken">  chain-broken</b-form-select-option>
<b-form-select-option value="check">  check</b-form-select-option>
<b-form-select-option value="child">  child</b-form-select-option>
<b-form-select-option value="cog">  cog</b-form-select-option>
<b-form-select-option value="cogs">  cogs</b-form-select-option>
<b-form-select-option value="ship">  ship</b-form-select-option>
</b-form-select>
</template>
很奇怪.. 想法?
编辑 1:我注意到它始终显示相同的图标。此外,bookmark 图标在选项列表中为轮廓,但在选中时为实心...
【问题讨论】:
标签: vue.js bootstrap-vue