Цикл по отфильтрованному списку в vue.js с параметром
Как выполнить цикл в vue.js по отфильтрованному списку с заданным входным параметром?
Пожалуйста. примите во внимание, что фильтрации, такой как <li v-for = "x in todos_filtered" v-if = "x.person == 'Mike'">, следует избегать со многими записями.
Вот код, который возвращает пустой список вместо 2 элементов.
<html>
<script src = "https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
<body>
<div id = "app">
<ul>
<li v-for = "x in todos_filtered('Mike')">
{{ x.text }}
</li>
</ul>
</div>
<script>
myObject = new Vue({
el: '#app',
data: {
todos: [
{ person: 'Mike', text: 'Learn JavaScript' },
{ person: 'Luke', text: 'Learn Vue.js' },
{ person: 'Mike', text: 'Build Something Awesome' }
]
},
computed: {
todos_filtered(person) {
return this.todos.filter((x) => x.person === person);
}
},
})
</script>
</body>
</html>
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
27
1
Перейти к ответу
Данный вопрос помечен как решенный
Ответы 1
Ответ принят как подходящий
Вычисляемое свойство должно возвращать функцию, которая принимает person в качестве параметра:
computed: {
todos_filtered() {
return (person)=> this.todos.filter((x) => x.person === person);
}
},
Другие вопросы по теме
Async await не работает в составной функции vue 3
Элементы таблицы отображаются под заголовком таблицы при прокрутке
Превышен максимальный размер стека вызовов Vue.js
Геттер Vuex не реагирует на изменение состояния
Vue 2: vue-router-3.x не перенаправляет/отправляет из App.vue
HTML не отображается на основе локально сохраненных переменных
Модуль не найден: ошибка: не удается разрешить «vue-confirm-dialog»
Группа параметров не может быть выбрана в quasar 2/Vue 3 при попытке миграции с quasar 1/vue 2
Переменная не изменяется в этом цикле - нет-немодифицированного-цикла-условия от ESLint
Как я могу показать сообщения проверки в vform?
Похожие вопросы
Заменить слова, найденные в строке
Получить координаты места, где произошло событие onLongPress — react-native-maps
Async await не работает в составной функции vue 3
Что я должен сделать, чтобы рабочие процессы листов копировались путем копирования рабочей области?
Как я могу заставить отображаемый тип сохранять свои типы при доступе к переменной?
Изменение массива с объектами
Возвращайте только совпадающие объекты из нескольких строк в многомерном массиве с использованием Javascript
Как создать 2d-массив, используя цикл for в Javascript?
Ссылки не изменились после сортировки по алфавиту
Удалять "?" из всего анкорного текста