Скрыть некоторую фразу в проекте VueJS

#javascript #vue.js

#javascript #vue.js

Вопрос:

Я работаю над приложением RealWord для проекта Vue. Я пытаюсь найти способ скрыть фразу «test», чтобы она не могла показывать какую-либо статью с фразой «test».

Компонент TagList.vue:

 <template>
  <ul class="tag-list">
    <li
      class="tag-default tag-pill tag-outline"
      v-for="(tag, index) of tags"
      :key="index"
    >
      <span v-text="tag" />
    </li>
  </ul>
</template>

<script>
export default {
  name: "TagList",
  props: {
    tags: Array
  }
};
</script>
  

Ответ №1:

Чтобы скрыть теги, содержащие «test», используйте вычисленный prop, чтобы получить отфильтрованный массив tags[] :

 export default {
  computed: {
    filteredTags() {
      return this.tags.filter(tag => tag !== 'test')
    }
  }
}
  

Затем обновите свой v-for , чтобы использовать этот вычисляемый реквизит:

 <li v-for="(tag, index) of filteredTags">
  

Комментарии:

1. я думаю, что это работает очень хорошо, но есть ошибка «Ошибка при рендеринге: «Ошибка ссылки: теги не определены»