我目前正在尝试从显示菜单项的数组中返回一些数据到我的搜索栏中

Question

我目前正在尝试创建一个搜索栏，以使用户轻松使用，以便他们可以输入任何成分（例如“ A”）的首字母，并返回与该项目关联的每个成分项目。 例如“鳄梨”

到目前为止，我只创建了一系列的成分。 我是编码的新手，所以不确定如何启动此过滤器列表。

这是我的成分数组的简要说明

const ingredients: any = `{
  "ingredients" : [
  {
     "ingredient" : "Avocado",
      "category" : "Prepped"
      "servings" : 35
 },
 {
     "ingredient" : "Chopped Bacon",
     "category" : "No Prep",   
      "servings" : 40,
 }
    ]

]

我的预期结果是用户在搜索栏中输入“ a”，菜单上的配料会弹出，例如...“鳄梨”，“芝麻菜”，“苹果”等。请记住，我的菜单是可折叠。 那么这将如何工作？

Answer 1

使用array.filter编写过滤器，并提供客户输入。 文档在这里