React查询调用查询来自儿童组件
因此，我有这样的组件：
const A = ({ id }) => {
const query = useMyQuery(id);
return <B data={query.data} query={query} />
}
const B = ({ data, query }) => {
return data.map(i => (<C item={i} query={query} />));
}
const C = ({ item, query }) => {
return (
<>
<SomeOther />
<D query={query} />
</>
);
}
const D = ({ query }) => {
const someAction = async () => {
await doSmth();
query.refetch();
}
return <button onClick={someAction}>Smth</button>;
}
如您所见，我将查询3个组件向下传递，只是为了换取。无需使用上下文，有没有更好的方法来执行此操作？我的意思是一些集成的反应查询解决方案？
So I have my components like this:
const A = ({ id }) => {
const query = useMyQuery(id);
return <B data={query.data} query={query} />
}
const B = ({ data, query }) => {
return data.map(i => (<C item={i} query={query} />));
}
const C = ({ item, query }) => {
return (
<>
<SomeOther />
<D query={query} />
</>
);
}
const D = ({ query }) => {
const someAction = async () => {
await doSmth();
query.refetch();
}
return <button onClick={someAction}>Smth</button>;
}
As you can see, I'm passing the query 3 components down just to refetch. Is there a better way to do this without having to use context? I mean some integrated React Query solution?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您可以使用
queryclient.refetchqueries（键）进行refcte-不一定是从USEQUERY重新调整的函数。you can use
queryClient.refetchQueries(key)to refetch - it doesn't have to be the function retuned from useQuery.