搜索过滤器不能在反应中采取排序功能

Question

我是 React 的新手，正在尝试从 youtube 教程React Beginners Tutorial - Build an Autocomplete Text Box 为我的 Web 应用程序 (https://github.com/pydevsg/Bank-Filter-App) 创建一个 AutoCompleteText 搜索框。但是当我通过 localhost 运行它时，它向我显示了这个错误。

但是当我通过 localhost 运行它时，它向我显示了这个错误。

TypeError: 无法读取未定义的属性“排序”

AutoCompleteText.onTextChanged

14 |让建议 = [];

15 | if (value.length > 0) {

16 | const regex = new RegExp(${value}, i);

17 |建议 = this.items.sort().filter(v => regex.test(v));

18 | }

19 | this.setState(() => ({ 建议，文本：值 }));

20 | };

我希望 SearchBox 应该能够按照我的 DataTable 显示所有数据。

Answer 1

好的，我知道您的问题是什么，您的组件渲染不合理，而没有渲染您需要的组件。

首先：

import App from "./App"; // Import your app

// Make it display the App
var displayDropdown = (
  <div style={{ display: "flex", justifyContent: "center" }}>
    <App />
  </div>
);

// Get rid of all other ReactDOM renders
ReactDOM.render(displayDropdown, document.getElementById("root"));

然后在DataTable.js 中，去掉你的AutoCompleteText 组件，它没有做任何事情并且是导致它爆炸的原因，因为你没有向它传递任何道具。如果您想将其保留在 DataTable 组件中，那么您需要将银行数组传递给它，就像您在 App.js 中所做的那样。

这应该会让你更接近你想去的地方。