在 VueJS 中使用父元素在 select 标签内循环

Question

我正在尝试循环浏览 eBay 上的这些类别，它们有一个父类别，然后是子类别，但父类别需要能够选择。这意味着我无法使用 optgroup，因此我尝试使用 div 标签来尝试这种方式，并打算添加类以不同的方式设置父类别的样式，但选项不会出现在 UI 中。我可以在这里使用任何类型的父元素吗？或者有人对替代解决方案有任何建议吗？

<div class="rr-field" v-if="ebay.categories">
        <label class="rr-field__label">eBay Category</label>
        <select class="rr-field__input" v-model="marketplaces.ebay.category">
          <option :value="null">Select one..</option>
          <div 
            v-for="(c, index) in ebay.categories"
            :key="index"
          >
            <option :value="c.category.categoryId">
              {{ c.category.categoryName }}
            </option>
            <option
              v-for="(c, index) in c.categoryTreeNodeAncestors"
              :key="index"
              :value="c.categoryId"
              >{{ c.categoryName }}</option
            >
          </div>
        </select>

Answer 1

我知道一定有一个我可以使用的元素，而且这是我在 smh 之前使用过的一个元素。 解决方案链接