Vuesax Vx-Select组件未显示选定标签

lrpiutwd 于 2023-03-19 发布在 Vue.js

关注(0)|答案(2)|浏览(220)

我正在使用NuxtJs v2.14和vuesaxv4.0.1-alpha.25by npm。当我使用这些部分代码为v-select创建循环时，在选择一个创建的选项后，此组件不会显示选定的标签。
我尝试和测试它的移动的设备和Win OS或每一个浏览器，如FireFox，Opera，Safari和Chrome，但它没有为我工作.
下面是我的代码：

<vs-select placeholder="choose your brand" v-model="carBrand">
  <vs-option v-for="(item, index) in brands" :key="index" :label="item.name" :value="item.id">
    {{ item.name }}
  </vs-option>
</vs-select>

vue.js

来源：https://stackoverflow.com/questions/65681875/vuesax-vx-select-component-doesnt-show-selected-label

2条答案

按热度按时间

tktrz96b1#

v-if =“数组.长度〉0”对我有效。

<vs-select placeholder="choose your brand" v-model="carBrand" v-if="brands.length > 0" >
  <vs-option v-for="(item, index) in brands" :key="index" :label="item.name" :value="item.id">
    {{ item.name }}
  </vs-option>
</vs-select>

赞(0）回复(0）举报 2023-03-19

g52tjvyc2#

这是一个呈现问题，您可以尝试使用v-if

<vs-select placeholder="choose your brand" v-model="carBrand" v-if="brands" >
  <vs-option v-for="(item, index) in brands" :key="index" :label="item.name" :value="item.id">
    {{ item.name }}
  </vs-option>
</vs-select>

或使用密钥重新加载组件

<vs-select placeholder="choose your brand" v-model="carBrand" :key="id" >
  <vs-option v-for="(item, index) in brands" :key="index" :label="item.name" :value="item.id">
    {{ item.name }}
  </vs-option>
</vs-select>

<script>
export default {
  data() {
    return {
      brands: [],
      id: new Date().getTime(),
    };
  },
  methods: {
    onLoadBrands() {
      this.brands = newBrands;
      this.id = new Date().getTime();
    },
  },
};
</script>

赞(0）回复(0）举报 2023-03-19

我来回答

Vuesax Vx-Select组件未显示选定标签

2条答案

相关问题

热门标签

最新问答