期望值:
使用react和redux过滤和查询一些数据。
我有3个场景:
1.使用搜索框中的值调用api(搜索框存在于另一条路线中,并获取用于搜索的值i从url中提取值)
1.使用筛选器按钮中的值调用api(当onChange发生时,i使用useState更改值)
1.使用默认值调用api
Ex方法:
*默认值():调用默认API示例:https:api/汽车&限制= 10 &偏移量=0
*按关键字搜索():调用默认API示例:关键字=vwbeetle&限制= 10 &偏移量=0
*按标签搜索():调用默认API示例:https:api/汽车?标签=红色、蓝色&限制= 10 &偏移=0
当页面加载时,默认搜索(如果关键字不存在)为默认搜索如果用户在搜索框中输入值,则Redux存储中的值将被重置,并且变量偏移量也将被重置,因为搜索类型已更改。如果用户单击标签过滤器,来自Redux存储的值也被重置,并且变量偏移量也被重置,因为搜索的类型被改变。
问题:
我如何执行所有类型的搜索与分页与当前类型的搜索?
代码
useEffect(() => {
if (keyword) {
searchKeyword(keyword);
} else {
searchTags();
searchDefault();
}
}, [keyword, searchDefault, searchKeyword, searchTags
]);
1条答案
按热度按时间mzillmmw1#
如果我没有理解错的话,你不需要default(),因为它只是Redux存储中的值,你可以在存储中设置关键字的默认值,这样它就可以调用默认的API。
此外,不要尝试使用useEffect()来进行命令性的状态更改,最好是将其用于不断变化的数据,如订阅。如果您希望以更好的方式执行搜索,您可以使用一个按钮,它只向Redux发送一个新的状态,您的页面将自动重新呈现,而不必在useEffect()中放入逻辑。
你还应该有一个临时关键字状态,它不与Redux连接,以防你没有这样的状态。