结果页面中的搜索表单 - ReactJs答案

【问题标题】：Search form within the Results page - ReactJs结果页面中的搜索表单 - ReactJs
【发布时间】：2021-03-13 12:55:05
【问题描述】：

我正在尝试使用此流程构建一个简单的搜索应用程序：

1 - 搜索页面有一个 SearchBar 和一个包含所有元素的列表。

2 - 在搜索页面中搜索单词（按查询过滤）时，这应该会将您重定向到结果页面。

3 - 如果您想查找不同的单词和下面列出的结果，结果页面有一个 SearchBar。

错误：当搜索不同的词（例如，AB 而不是 AA）时，我收到一个错误无法读取未定义的属性“结果”，我不知道如何解决它。 https://codesandbox.io/s/damp-cloud-k0poc?file=/src/data.js:96-101

我的应用基于以下示例：

任何想法将不胜感激。

【问题讨论】：

【解决方案1】：

event.preventDefault() 应该可以解决您的问题。

在您的 SearchBar.js 中，在提交方法中添加 event.preventDefault(); 以阻止应用重新加载。

submit = (event) => {
    event.preventDefault();
    ...........
    ...........
    ...........
  };

【讨论】：