Context Provider调用消费者内部的异步函数在承诺解决后不返回任何内容
Context Provider调用消费者内部的异步函数在承诺解决后不返回任何内容
提问于 2022-09-02 04:45:36
我试图从提供者调用一个异步函数，然后根据响应显示内容，但是没有返回任何内容。有人能告诉我我做错了什么吗？以下是代码：
const App = () => {
return (
<>
<Header />
<UserConsumer>
{
({getProfile}) => {
getProfile.then(profile) => {
return profile && (
<h3>{profile.name}</h3>
)
}
}
}
</UserConsumer>
</>
)
}我可以看到getProfile返回了配置文件数据的承诺，即使我删除了profile &&，也没有显示任何内容。我也以同样的方式使用其他功能。getProfile是唯一的异步函数，我不知道为什么会有这个问题。
有什么想法吗？谢谢
回答 1
Stack Overflow用户
回答已采纳
发布于 2022-09-02 05:10:07
假设您的UserConsumer呈现逻辑如下所示：
<div>{props.children({getProfile})}</div>由于您没有在此函数中返回任何内容：
({getProfile}) => {
getProfile.then(profile) => {
return profile && ( // this is return value of then callback, not props.children
<h3>{profile.name}</h3>
)
}
}每次React呈现UserConsumer时，要呈现的最后一个JSX是：
<div>{undefined}</div>代码的主要问题是，不应该在的返回部分执行异步操作。
如果需要基于服务器端数据(如概要文件数据)呈现某些UI，则需要在useEffect中获取数据，然后将接收到的数据放在某些state中，并使用state作为组件的回报。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73577878
复制相关文章
相似问题
腾讯云开发者
