Javascript 如何等待导出React组件，直到收到请求。（Shopify应用程序开发）

首先，我对Shopify应用程序开发以及React和Next.js都是新手，所以这可能是一个有点愚蠢的问题。我当前正在向一个网站发送请求，并且我正在使用我正在导出/呈现的React组件中的响应，因此我需要等待直到有了该响应才能导出React组件，因此它不是未定义的。代码如下：

if（窗口类型==='undefined'）
{ 
axios（config）//我正在等待的实际请求
.然后（功能（响应）{
siteHTML=response.data；//我要添加到react//组件的元素
})
.catch（函数（错误）{
console.log（错误）；
});
}
//我需要在得到变量“siteHTML”后定义此函数
//如果我先在函数外部定义“let”，然后重新分配
//在响应之后，react使用第一个空赋值。如果我定义
//在函数中，它是一个局部变量而不是全局变量。
const Index=（）=>（//要呈现的实际Next.js/React导出
网站HTML:
{siteHTML}
)
出口违约指数我认为您缺少的关键元素是使用。实际上，您可以将其应用于整个return语句

比如：

const Index = () => { 
  return !siteHTML ? (
    <div>loading...</div>
   ) : (
      <div>
        <h1>Site HTML:</h1>
        <div>
          { siteHTML }
        </div>
      </div>
   )
}

const Index=（）=>{
return！siteHTML(
加载。。。
) : (
网站HTML:
{siteHTML}
)
}

因此，如果
siteHTML
尚不存在，则返回加载微调器或加载文本或任何您想要的内容。一旦请求完成并且
siteHTML
，返回函数将交换并呈现该请求