Laravel 如何在Vue JS中使用嵌套循环？

在这里，我想在选择选项中的foreach循环中使用foreach循环

<select class="form-control" style="width: 100%;" v-model="category_id"  >
<option value="0">Select Main Category</option>
<optgroup v-for='section in categories' v-bind:label="section.name">
    <option  v-for='category in section.categories' :value="category.id">&nbsp;-&nbsp;{{category.category_name}}
    </option>
    <option v-if="" v-for="subCategory in category.sub_categories">&nbsp;&nbsp;--&nbsp; {{subCategory.category_name }}</option>
</optgroup>

选择主要类别
-{{category.category_name}
--{{subCategory.category_name}

但它不起作用……

此时未定义类别，它是在上面的选项中的

v-for

中定义的，在到达该选项之前，该选项已关闭。因此，您将获得未定义的

子类别

像下面这样的改变会奏效

<select class="form-control" style="width: 100%;" v-model="category_id"  >
<option value="0">Select Main Category</option>
<optgroup v-for='section in categories' v-bind:label="section.name">
    <optgroup  v-for='category in section.categories' :value="category.id">&nbsp;-&nbsp;{{category.category_name}}
        <option v-if="" v-for="subCategory in category.sub_categories">&nbsp;&nbsp;--&nbsp; {{subCategory.category_name }}</option>
    </optgroup>
</optgroup>

选择主要类别
-{{category.category_name}
--{{subCategory.category_name}

此时未定义类别，它是在上面的选项中的

v-for

中定义的，在到达该选项之前，该选项已关闭。因此，您将获得未定义的

子类别

像下面这样的改变会奏效

<select class="form-control" style="width: 100%;" v-model="category_id"  >
<option value="0">Select Main Category</option>
<optgroup v-for='section in categories' v-bind:label="section.name">
    <optgroup  v-for='category in section.categories' :value="category.id">&nbsp;-&nbsp;{{category.category_name}}
        <option v-if="" v-for="subCategory in category.sub_categories">&nbsp;&nbsp;--&nbsp; {{subCategory.category_name }}</option>
    </optgroup>
</optgroup>

选择主要类别
-{{category.category_name}
--{{subCategory.category_name}

什么具体不起作用？您是否收到错误消息？如果是的话，信息是什么？你什么时候收到的？移除那个空的v-if看起来确实是一个好的开始。我还建议再次检查v-fors是否与您的数据结构相匹配——这表明您有一个categories数组，其中包含具有分类元素的元素。这是准确的吗？未定义的“子类”。。。。但当我们把期权放在另一个期权字段中时，它就起作用了……但这不是我想要的。。。。。我有一个充满元素的类别数组…但它不工作…-此时未定义类别，它是在上面的选项中的v-for中定义的，在您进入此选项之前，该选项已关闭。是的，James Clark Developer…但如果我们将选项放在选项内。那么所有类别和子类别都放在一行中。那么…有什么具体不起作用？您是否收到错误消息？如果是的话，信息是什么？你什么时候收到的？移除那个空的v-if看起来确实是一个好的开始。我还建议再次检查v-fors是否与您的数据结构相匹配——这表明您有一个categories数组，其中包含具有分类元素的元素。这是准确的吗？未定义的“子类”。。。。但当我们把期权放在另一个期权字段中时，它就起作用了……但这不是我想要的。。。。。我有一个充满元素的类别数组…但它不工作…-此时未定义类别，它是在v-for中定义的，在上面的选项中，是的，James Clark开发者…但是如果我们把选项放在里面，那么所有的类别和子类别都放在一行中，那么…如果我们把选项放在里面，那么所有的类别和子类别都放在一行中..并且会同时被选中..所以这不是我想要的..现在我想你的现在的问题解决了。嘿，上面的问题解决了吗？那就接受我的回答。谢谢。不，它不起作用……现在它只显示部分名称……虽然谢谢如果我们把选项放在选项里面。然后所有类别和子类别都放在一行中。并且将同时选中两者。所以这不是我想要的方式。现在我想你当前的问题已经解决了。嘿，它解决了你的上述问题吗？那就接受我的回答。谢谢。不，它不起作用……现在它只显示部分名称……尽管谢谢