Question

我正在构建一个react应用程序，其中我在表视图中加载了媒体文件。我在这个页面上有一个搜索栏。我已经看到许多页面动态刷新内容，因为用户继续在搜索栏中输入文本。我怎样才能做到这一点？我在后端准备好了搜索API。这个api给了我基于搜索文本加载的新内容。目前，只要点击搜索图标，我就可以考虑调用此api。但是我想让它变得动态，例如当用户不断输入文本时，内容应该自动刷新。我怎么能这样做？

Answer 1

如果按钮的事件处理程序已经有效，您只需将其用于搜索输入字段的 onChange事件：

const mySearchHandler = function(event) {
     const searchQuery = event.target.value;

     ...
}

...

<input onChange={mySearchHandler} />

您可能需要小心不要经常进行API调用，例如：如果用户输入快速。 Lodash的_.throttle()可能是一个很好的起点。

基于搜索文本动态刷新内容

1 个答案: