這是我的代碼，如何僅回傳此膳食 [] 陣列中唯一搜索到的專案？
constructor(props) {
super(props);
this.state = {
meals: [],
};
this.searchMeal = this.searchMeal.bind(this);
}
這是我的搜索功能，但我不知道如何使它起作用！
searchMeal(event) {
let search = event.target.value;
let meals = this.state.mealsList;
let mealsContent = [];
if (search.length > 0) {
// searched meals
} else {
// get meals if no results
}
this.setState({
meals: mealsContent
});
}
uj5u.com熱心網友回復：
例如，您可以在陣列中使用此代碼
meals.map((meal, index) => {
if (meal.name.toLowerCase().includes(search.toLowerCase())) {
mealsContent.push(meal);
}
});
最后一個例子是：
searchMeal(event) {
let search = event.target.value;
let meals = this.state.mealsList;
let mealsContent = [];
if (search.length > 0) {
// searched meals
meals.map((meal, index) => {
if (meal.name.toLowerCase().includes(search.toLowerCase())) {
mealsContent.push(meal);
}
});
} else {
// get meals if no results
this.getMeals(); // call your get meals function or call the old meals array
}
this.setState({
meals: mealsContent
});
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/379616.html