VUE中的滤镜嵌套环

Question

vue新的，我想循环浏览每个类别，然后显示帖子。

<section v-for="(category) in (categoryList)">
    <h2>{{category.title}}</h2>
    <div v-for="(post) in (sortedActivity, filteredList)">
        {{post.title}}
    </div>
 </section>

类似上述内容。

sortedActivity函数是一种简单的排序，filteredList功能是搜索。

但是如何将{{category.title}}解析到计算中的这些功能？我假设我想更新具有类别标题的当前实例状态？但不确定在循环中最简单的方法会改变。或者如果有另一种方法(不是字面的(？

谢谢

Answer 1

我假设您希望首先使用filteredList搜索类别，然后使用sortedActivity进行排序。在这种情况下，您可以使用：

<section v-for="category in categoryList">
  <h2>{{ category.title }}</h2>
  <div v-for="post in sortedActivity(filteredList(category.title))">
    {{ post.title }}
  </div>
</section>

但是，通常，您应该创建另一个子组件，如下：

<category-posts :category="category" v-for="category in categoryList">
</category-posts>

每个category-posts在哪里：

<section>
  <h2>{{ category.title }}</h2>
  <div v-for="post in sortedActivity(filteredList(category.title))">
      {{ post.title }}
  </div>
</section>

这将有助于您将外部循环和内部循环分开，并避免内部前循环的重新构成。另外，不要忘记使用key属性。