Question

我是React的新手，正试图从youtube教程React Beginners Tutorial - Build an Autocomplete Text Box中为我的Web应用程序（https://github.com/pydevsg/Bank-Filter-App）创建一个AutoCompleteText搜索框。但是当我通过本地主机运行它时，它向我显示此错误。

但是当我通过本地主机运行它时，它向我显示此错误。

TypeError：无法读取未定义的属性“ sort”

AutoCompleteText.onTextChanged

14 |让建议= [];

15 |如果（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应该能够按照我的数据表显示所有数据。

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中一样将库数组传递给它。

这应该使您更接近想要的位置。

搜索过滤器无法在反应中采用排序功能

1 个答案: