javascript 类星体在选择下拉菜单中设置默认值

31moq8wy  于 2023-01-04  发布在  Java
关注(0)|答案(1)|浏览(148)

我有一个类星体选择:

<q-select
    rounded
    outlined
    bottom-slots
    stack-label
    :dense="dense"
    v-model="geoStateColorSelected"
    :options="geoStateColorOptions"
    label="Select a Color for State display"
    class="mystyle"
    emit-value
    map-options
    @input= "geoStateColorChange()"      
  />

我的选择是:

[ {
    label: 'NONE',
    value: []
  },
  {
    label: 'BLUE',
    value: ["#a6bddb","#74a9cf","#3690c0","#0570b0","#045a8d","#023858"]
  },
  {
    label: 'ORANGE',
    value: ["#fec44f","#fe9929","#ec7014","#cc4c02","#993404","#662506"]
  }
],

如果设置"geoStateColorSelected:"蓝色"
蓝色显示在选择框中,但如果尝试使用geoStateColorSelected,则会得到蓝色而不是Array对象
第一次:

let colorObject = this.geoStateColorSelected
    colorObject is "BLUE"

但如果我选择一个下拉列表值,它将使用Select I get

let colorObject = this.geoStateColorSelected
  colorObject  is Array(6)

这就是我想要的默认值。
我试过了

created(){
     this.geoStateColorSelected = this.geoStateColorOptions.find(o => o.value == this.geoStateColorSelected)
    },

但却得不到定义
如何将默认值设置为对象?
我的破解方法是:

let colorGroup = []
       if(this.geoStateColorSelected == "BLUE"){
        colorGroup = this.geoStateColorOptions[1]
      } else {
        colorGroup = this.geoStateColorSelected
      }

在需要使用它的函数中。
谢啦,谢啦

cuxqih21

cuxqih211#

所以问题是你在q-select中添加了emit-value,所以它只输出value而不是整个选项,所以如果你想设置默认值,你需要选项的value。
请参考以下代码页。
https://codepen.io/Pratik__007/pen/abjZeWL

相关问题