Je ne peux pas afficher les résultats des articles d'actualité auxquels plusieurs balises/cases à cocher sont attribuées dans Vue 2. Si je coche une seule étiquette/case à cocher, mes résultats s'affichent correctement. Qu'est-ce que je pourrais faire de mal ici ?
var tagData = [ { id: 1, title: "Internal" }, { id: 2, title: "Industry" }, { id: 3, title: "Company" } ]; var articleData = [ { id: 1, pagetitle: "Card title that wraps to a new line", image: "https://via.placeholder.com/500x250/171717/222222?text=500x250", tags: [ "Internal", "Industry", "Company", ], content: "This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.", alias: "/news-article-1", published: 1672668835 }, { id: 2, pagetitle: "Card title", image: "https://via.placeholder.com/500x250/171717/222222?text=500x250", tags: [ "Company", ], content: "This card has supporting text below as a natural lead-in to additional content.", alias: "/news-article-2", published: 1672668835 }, { id: 3, pagetitle: "Card with no image", image: "", tags: [ "Internal", "Company", ], content: "This is another card with title and supporting text below. This card has some additional content to make it slightly taller overall.", alias: "/news-article-3", published: 1672668835 }, { id: 4, pagetitle: "Yet another article", image: "", tags: [ "Industry" ], content: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.", alias: "/news-article-4", published: 1672668835 }, ]; var vm = new Vue({ el: "#app", data: { articles: articleData, search: '', tags: tagData, checkedTags: [] }, computed: { searchArticles: function searchArticles() { var result = this.articles.filter(function (article) { // articles can have more than one tag/category assigned //if any checkboxes have been checked... if(this.checkedTags.length) { return article.tags.some(tag => tag.includes(this.checkedTags)) && (article.pagetitle.toLowerCase().match(this.search.toLowerCase()) || article.content.toLowerCase().match(this.search.toLowerCase()) ) } else { return article.pagetitle.toLowerCase().match(this.search.toLowerCase()) || article.content.toLowerCase().match(this.search.toLowerCase()) } }, this); return result; } } });
checkedTags contient un tableau. Par exemple : une variante de ["Internal", "Industry"]
我尝试过 .some
和 .every
, mais ma logique est évidemment incorrecte.
Vous devez modifier vos tags à partir de ce chèque :
À ceci :
Vous devez vérifier si toutes les balises cochées sont présentes dans l'article.
Votre chèque
.some(tag => tag.includes
是错误的,因为您将includes
est appliqué à un article marqué. Cela devrait être autre chose.includes doit être appliqué aux tableaux.
tag.includes(tags)tags.includes(tag)
,但不是tag.includes(tags)
tags.includes(tag), mais pastags.length > 1
,tag.includes(tags)
将始终为false
Sitags.length > 1
,