bugfix> vuejs2 > 投稿

el-select-groupの場合 el-select-groupとdataを使用すると、子が[]であるため、オプションを選択できません それは私のデータです

data() {
  return {
    options3: [{
      label: 'Popular cities',
      options: [{
        value: 'Shanghai',
        label: 'Shanghai'
      }, {
        value: 'Beijing',
        label: 'Beijing'
      }]
    }, {
      label: 'Indonesia',
      options: [{
        value: 'Jakarta',
        label: 'Jakarta'
      }, {
        value: 'Bandung',
        label: 'Bandung'
      }]
    }, {
      label: 'Singapore',
      options: []
    }, {
      label: 'Thailand',
      options: []
    }],
    value7: ''
  }
}

期待:子供がいて、子供が[]のときに選択できるオプションを選択します。

ここに私のコードがあります https://jsfiddle.net/dede402/jruzj07d/

回答 1 件
  • 2つのオプションがあります。

    データにオプションを追加する { label: 'Singapore', options: [{ value: 'Singapore', label: 'Singapore' }] }

    テンプレートの変更: <template> <el-select v-model="value7" placeholder="Select"> <template v-for="group in options3"> <el-option-group v-if="group.options.length > 0" :key="group.label" :label="group.label"> <el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value"> </el-option> </el-option-group> <el-option v-else :key="group.label" :label="group.label" :value="group.label"> </el-option> </template> </el-select> </template>

あなたの答え