Vue.js 选择标记的渲染选项为空，但生成的选项数量与数据源计数VUE/IONIC相同

我想在Ionic/Vue中使用v-for指令呈现select标记的选项。看起来数据源与组件的通信很好，但v-for生成了一个空白选项。链接如下：

---

您的代码中缺少一些单词。我已经做了更改，输出如您所述。 此外，您还可以在选择标记中使用v-bind作为v-model

<div style="text-align: center; margin-top:30px; ">
  <select style="width: 300px; margin-left: 50px" v-model="selecteds">
        <option
          v-for="option in options"
          :key="option.name"
          style="color: black"
        >
          <!-- Changes -->
          {{ option.name }}
        </option>
      </select>
  <ion-label >{{selecteds}}</ion-label> 
</div>

{{option.name}
{{selecteds}}

data(){
  return{
    selecteds: '',
    options: [
      {name: 'Foo'},
      {name: 'Boo'},
      {name: '3rd'},
    ],
  }
  },

<div style="text-align: center; margin-top:30px; ">
  <select style="width: 300px; margin-left: 50px" v-model="selecteds">
        <option
          v-for="option in options"
          :key="option.name"
          style="color: black"
        >
          <!-- Changes -->
          {{ option.name }}
        </option>
      </select>
  <ion-label >{{selecteds}}</ion-label> 
</div>