首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >React获取数据并通过上下文API将其保存在全局状态

React获取数据并通过上下文API将其保存在全局状态
EN

Stack Overflow用户
提问于 2019-11-19 00:29:41
回答 2查看 1.9K关注 0票数 1

使用react context api创建全局状态,并获取数据并将其保存在context对象中,以便子组件可以访问数据,这是一个好主意吗?或者更好的做法是在根组件中获取数据,然后通过props将其传递给子组件。

如果使用上下文api的全局状态更好,我如何获取数据并将其保存在全局状态中,因为获取函数是异步的,我一直使用React useEffect来解决它。

下面是我的全局状态的一个片段

代码语言:javascript
运行
复制
import React from "react";

const GlobalState = React.createContext(null);

const socket = 'http://localhost:5000/';

const fetch_all_users = () => {
    fetch(socket + 'get_users_data')
        .then(response => response.json())
        .then(json => {
            console.log(json)
        })
        .catch(error => {
            console.log(error);
        });
}

const fetch_all_doors = () => {
    fetch(socket + 'get_doors_data')
        .then(response => response.json())
        .then(json => {
            console.log(json)
        })
        .catch(error => {
            console.log(error);
        });
}
EN

回答 2

Stack Overflow用户

发布于 2019-11-19 00:52:04

您实际上可以将context用作全局状态,但请注意,当您获取数据时,context的初始数据可能为空,因此您可以显示一个加载屏幕。

您也可以使用useEffectHook,但我更倾向于使用一个完整的组件作为上下文提供者。

另请注意,您将无法触发上下文更新。因此,如果您需要在较新的状态下更新状态,您可能需要以某种方式重新加载整个应用程序,或者使用redux或您选择的任何状态管理

票数 6
EN

Stack Overflow用户

发布于 2021-12-26 05:20:27

react-query是一个整洁的库,用于管理从后端检索的数据。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/58919020

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档