如何按位置筛选搜索结果以及如何重新发送

Question

我当前正在组件中呈现用户的搜索结果，这些结果存储在一个名为的状态中

const [searchData, setSearchData] = useState<any>([]); 

然而，我添加了一个左侧导航栏，用户可以通过位置、发布日期等进行搜索。。。。我已经在左侧导航栏上获得了搜索结果的城市(位置(列表，如果用户想点击每个城市，我想只按该城市更改搜索结果过滤。

到目前为止，我已经能够获得每个onClick的console.log(位置(，所以现在我陷入了应该如何重新呈现结果的困境。如果我用这个onClick句柄更新setSearchData。我在这个组件中得到了其他函数的未定义.map错误。

所以。。我应该如何处理基于点击位置过滤器的重新呈现搜索结果？

Answer 1

请尝试这样做：

const [searchData, setSearchData] = useState<any>({data: [], save: []}); 
const onChange = (value: string) => {
setSearchData({
...searchData,
save: searchData.data.filter((x) x.name.indexOf(value) > -1)
})
}

const state = ["Fish","Dog","Cat"]
const data = state.filter((x) => x.indexOf("Fish") > -1)
console.log(data)

Answer 2

请找到一个粗略的代码：

const [searchData, setSearchData] = useState<any>([]); 
filteredData use this to display
const [filterOption , setFilterOption] =useState();
const [filteredData, setFilteredData] = useState<any>([]);
const onFilterChange = () =>{
setFilterOption()//set filter here
}
useEffect(()=>{
//... Apply Filter Logic
let filteredRows = []
setFilteredData(filteredRows)

}，[filterOption](