Question

下一个 js react app fetch 未定义错误

2018-11-25

7852

javascript reactjs next.js

我正在尝试克隆以下 next.js react 应用程序并在 localhost:3000 上运行它

https://github.com/elee-ittdublin/lab6-nextjs

当我打开 localhost:3000 时，我收到以下错误

未处理的拒绝 (ReferenceError): fetch 未定义 Function._callee$ ./pages/index.js:22

20 | // see https://nextjs.org/learn/basics/fetching-data-for-pages
>22 | Index.getInitialProps = async function() {
24 |   const url = 'https://api.tvmaze.com/search/shows?q=batman';

我试图研究我做错了什么，但我仍然无法解决我的问题。有人能看到我哪里出错了吗？

干杯

Answer 1

如果您转到此处的示例 examples 并搜索 fetch ，您将看到他们正在使用的内容。示例中是 node-fetch - node-fetch

Answer 2

fetch 是 浏览器 中的 预定义 方法，但您的函数在服务器端有效，因此它不起作用。

有一个 npm 包基本上将浏览器的 fetch 和 node-fetch 结合在一起，它被命名为 isomorphic-unfetch，您可以通过命令 npm install isomorphic-unfetch 安装它。

之后，在您想要使用 fetch 方法的任何地方使用 unfetch 方法。

PS： 在较新版本的 Next.JS（10.0.0 及以上版本）中，您应该不会看到此问题。

Answer 3

可能是包未安装。尝试安装 https://www.npmjs.com/package/isomorphic-unfetch

Jayanta Baishya

2018-11-25