小编Pun*_*ari的帖子

调用 REST API 并将其响应存储在 Context API 中

我的 React 应用程序要求在 Context API 中存储 API 驱动的数据。类函数不仅仅是我们正在使用的功能组件。

我尝试将 await 与 fetch 调用一起使用,但没有成功

const App = props => {
  const { initState } = props
  return (
    <AppContextProvider  initState={initState}>
      <HoldingDetailsContainer initState={initState} />
    </AppContextProvider>
  )
}

const AppContextProvider = (props) => { 
    const { resources } = useGetResourceApi();


    const context = {
        resources 
    };
    return (
        <AppContext.Provider value={context}>
            {props.children}
        </AppContext.Provider>
    )
}
Run Code Online (Sandbox Code Playgroud)

如果我在前面使用 await,useGetResourceApi它会抛出错误“对象作为 React 子对象无效(找到:[object Promise])。如果您打算渲染子对象集合,请改用数组。”

是否可以在上下文 API 中存储 API 驱动的数据

javascript reactjs react-context

4
推荐指数
2
解决办法
5411
查看次数

将数组递归转换为特定格式

我有一个包含分层数据的数组,我想将其转换为层次结构,但格式不同。我尝试使用递归方法,但它没有提供正确的数据

下面是我试图实现的代码

static convertConfigJson(data, finalResults = []) {

        const configData = JSON.parse(JSON.stringify(data));

        return configData.map((item) => {
            const { name, type, value, path } = item;
            let children = {}
            if (type === 'Object') {
              children = this.convertConfigJson(value, finalResults);
            } else {

            finalResults.push({
                id: name,
                name: name,
                children: children
            })
            }




            console.log('>>>>>>>>>', finalResults)

            return finalResults;
          });   
    }
Run Code Online (Sandbox Code Playgroud)

下面是我从 API 获取的 JSON 数组

[
        {
            "name": "info",
            "type": "Object",
            "value": [
                {
                    "name": "app",
                    "type": "Object",
                    "value": [
                        {
                            "path": "info.app",
                            "name": …
Run Code Online (Sandbox Code Playgroud)

javascript arrays recursion multidimensional-array

0
推荐指数
1
解决办法
103
查看次数