采用计算属性过滤后再遍历数据可维护性强

是的，采用计算属性来过滤数据再遍历数据的做法可以提高代码的可维护性。

使用计算属性的好处在于，它能够将数据的处理逻辑从模板中抽离出来，使得模板更加简洁明了。同时，计算属性能够缓存计算结果，避免重复计算。

在数据量较大或者需要复杂的数据处理逻辑时，采用计算属性来过滤数据再遍历数据能够提高代码的可维护性。这种做法可以使代码更加清晰，易于理解和修改。

下面是一个使用计算属性来过滤数据再遍历数据的示例：

<template>
  <div>
    <ul>
      <li v-for="item in filteredList" :key="item.id">{{ item.name }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      list: [
        { id: 1, name: 'Apple', category: 'fruit' },
        { id: 2, name: 'Orange', category: 'fruit' },
        { id: 3, name: 'Carrot', category: 'vegetable' },
        { id: 4, name: 'Broccoli', category: 'vegetable' }
      ],
      filter: ''
    }
  },
  computed: {
    filteredList() {
      const filter = this.filter.toLowerCase()
      return this.list.filter(item => item.name.toLowerCase().includes(filter))
    }
  }
}
</script>

在上面的代码中，我们使用计算属性`filteredList`来过滤数据，并在模板中使用`v-for`指令遍历过滤后的数据。这种做法可以使代码更加清晰易懂，同时也便于后期维护。