无法为我的 flatList 使用过滤器方法

Question

我一直在尝试过滤掉用户输入的项目名称，并告诉他们该项目已找到，如果该项目不存在，那么也应该提醒用户，但我没有不知道出于某种原因，我的过滤方法似乎不起作用。这是我现在的 flatList。

const data = [
  {
    groceryItem: 'Apple',
    price: '.99',
    category: 'Produce',
    src: require('./assets/apples.jpg'),
    id: Math.floor(Math.random() * 100) + 1
  },
  {
    groceryItem: 'Pear',
    price: '.49',
    category: 'Produce',
    src: require('./assets/pear.jpg'),
    id: Math.floor(Math.random() * 100) + 1
  }]

这是我用来搜索列表中项目的代码。 NameInput为用户输入，设置为用户输入的内容。

 const [nameInput, setNameInput] = useState('');
 const [itemsList, setItemsList] = useState(data); //storing data items temporarily

 const searchItem = () => {
    if (nameInput == "") {
      Alert.alert("At least an input is empty.");
    } 
    else if (itemsList.filter(itemFound)) {
      Alert.alert("Item " + nameInput + " has been found." + '\n' + 'You want to add it in the list?'+"\n"+"If, yes click on the modal below.");
    }
  };


function itemFound(item) {
  if (item.groceryItem == nameInput ) {
    return item;
  }else{
    Alert.alert(nameInput +" isn't available. Sorry!");
  }
}

稍后单击该按钮时，应提醒用户该项目是否存在于列表中。我不知道让我的过滤方法在这里工作我缺少什么。如果有人可以帮助我解决这个问题，那就太好了。提前致谢！

Answer 1

您不能 return item 过滤功能。它 returns true 或 false。单独过滤 return 一个新的（过滤后的）数组。

尝试找到这样的产品：

const searchItem = () => {
    if (nameInput === "") {
        Alert.alert("At least an input is empty.");
    } 
    else if (itemFound()) {
        Alert.alert("Item " + nameInput + " has been found." + '\n' + 'You want to add it in the list?'+"\n"+"If, yes click on the modal below.");
    }
};

function itemFound() {
    for (let item of itemsList) {
        if (item.groceryItem === nameInput)
            return true;
    }

    return false;
}

Answer 2

如果您只想查看该项目是否在列表中，您可以使用 Array.some 如果找到，这将 return true，如果找不到，则 false。

如果要访问相关对象，可以使用 Array.find，它将 return 对象或 undefined。 Array.filter 将 return 一个包含所有匹配对象的数组，而 find 将 return 第一个找到的对象，所以这取决于你想做什么

const searchItem = () => {
    const itemFound = itemsList.some(item => item.groceryName === nameInput);

    if (nameInput == "") {
      Alert.alert("At least an input is empty.");
    } else if (itemFound) {
      Alert.alert("Item " + nameInput + " has been found." + '\n' + 'You want to add it in the list?'+"\n"+"If, yes click on the modal below.");
    } else {
      Alert.alert("not found..."
    }
  };

无法为我的 flatList 使用过滤器方法

Trouble having filter method working for my flatList

javascript

filter

reactjs

react-native

react-native-flatlist