TanStackT
TanStack13mo ago
7 replies
faint-white

in search data is falling back to placeholder, due to key change

I am implementing a search on click, but when I change the searchBy the data falls back to the placeholder data, which is expected. since it's a different key that points to a different cache.

tha solution, I found is to remove the searchBy from key, but eslint is not happy, is there any other recommended way to do this?

const [searchBy, setSearchBy]
 = useState()

const { data, refetch } = useQuery({
  enabled: false,
  queryKey: ["todo", searchBy],
  queryFn: () => searchTodo(searchBy),
  placeholderData: []
});

return <> 
      <input onChange={(e) => setSearchBy(e.target.value)}>
      <button onClick={() => refetch}> search<button>

      {data.map((todo)=> <div key={todo.id}>{todo.name}/div>
    </>
Was this page helpful?