Next.js，在按钮点击时发出 POST 请求SSG

问题描述

我正在做一个 ssg 网站，它没有后端，但它确实开始具有一些从另一台服务器获取一些数据的功能。我检查了 SWR 并且它工作正常，问题是我需要在按钮点击时发出一个发布请求，它给我一个错误：

hooks can only be called inside of the body of a function component

我看到的是，我可以创建一个函数组件，在其中设置一个调用，然后在单击按钮时安装这个组件，它可以工作，但我对这种方法有疑问。 这可能是为了处理 get 请求，但我发了一个帖子。

ExportComponent 在页面或其他组件中呈现。

function ExportComponent() {
  const [exportCalled,setExportCalled] = useState(false)
  const exportCall = () => {
    setExportCalled(true)
  }

  if (exportCalled) {
    return (
      <CallExport></CallExport>
    )
  }

  return (
    <Button
      onClick={ exportCall() }
    >
      Export
    </Button>
  );
}

function CallExport() {
  // api post call
  const { data,isLoading } = exportProject();
  if (isLoading) {
    return <CircularProgress />;
  }
  return (
    // call to api is done,make something with data
    <Button>Open</Button>
  )
}


export function exportProject() {
  const params = {
    method: 'POST',headers: {
        'Content-Type': 'application/json'
    },body: JSON.stringify({}),};
  const exportFetcher = (url) => fetch(url,params).then((r) => r.json());
  const { data,error } = useSWR('url',exportFetcher);
  return {
    data,isLoading: !error && !data,isError: error
  }
}
    

有错吗？有没有更好的办法？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）