[英]react async hook how to do it
This is my react component..这是我的反应组件..
const DashboardContext = React.createContext()
function DashboardStateProvider({ children }) {
const wallet = useWallet()
const Provider = DashboardContext.Provider
if (wallet.account)
return (
<WithSubscription Provider={Provider} connectedAccount={wallet.account}>
{children}
</WithSubscription>
)
return (
<Provider
value={{
}}
>
{children}
</Provider>
)
}
async function WithSubscription({ Provider, connectedAccount, children }) {
// Juror ANT balances, 24h ANT movements and claimed subscription fees
const data = await apiCALL(connectedAccount)
// bla bla bla code here
}
function useDashboardState() {
return useContext(DashboardContext)
}
export { DashboardStateProvider, useDashboardState }
The problem is that it shows an error when I use async
on the withSubscription
function.问题是当我在withSubscription
function 上使用async
时它显示错误。 It's really mandatory, because in it, I am making an async call await apiCALL
.这确实是强制性的,因为在其中,我正在进行异步调用await apiCALL
。
ERROR:错误:
Unhandled Rejection (Error): Invalid hook call.未处理的拒绝(错误):无效的挂钩调用。 Hooks can only be called inside of the body of a function component.钩子只能在 function 组件的主体内部调用。 This could happen for one of the following reasons:这可能由于以下原因之一而发生:
- You might have mismatching versions of React and the renderer (such as React DOM)你可能有不匹配的 React 版本和渲染器(例如 React DOM)
- You might be breaking the Rules of Hooks您可能违反了 Hooks 规则
- You might have more than one copy of React in the same app See react-invalid-hook-call for tips about how to debug and fix this problem.您可能在同一个应用程序中拥有多个 React 副本请参阅 react-invalid-hook-call 以获取有关如何调试和修复此问题的提示。
Any ideas?有任何想法吗? I have to fix this and i am not a react developer, so I'd appreciate the direct answer what to change exactly.我必须解决这个问题,而且我不是反应开发人员,所以我很感激直接回答要改变什么。
UPDATE:更新:
How do I use useDashboardState
?如何使用useDashboardState
?
import { useDashboardState } from '../components/Dashboard/DashboardStateProvider'
const {
data
} = useDashboardState()
i'm not tested your code but i think problem here const DashboardContext = React.createContext()
try to create this hook inside of function component我没有测试你的代码,但我认为这里有问题 const DashboardContext = React.createContext()
尝试在 function 组件内创建这个钩子
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.