Question

我在我的React应用程序中得到Cannot read property 'map' of undefined-虽然这通常意味着我正在搜索不正确的数据类型（例如，对象与数组），但是我无法console.log API URL，这让我觉得其他地方有问题。

这是我的代码，所有内容都存在于我的App.js文件中，因此调用其他组件或任何东西都不是问题：

import React, { Component } from 'react';
import './App.css';

const APIURL = `https://api.openbrewerydb.org/breweries?`;
const citySearch = `by_state=new_york`;

class App extends Component {
  constructor() {
    super()

    this.state = {
      error: null,
      isLoaded: false,
      breweries: []
    };
  }

  componentDidMount() {
    fetch(APIURL + citySearch)
      .then(res => res.json())
      .then(
        (result) => {
          this.setState({
            isLoaded: true,
            breweries: result.breweries
          });
        },
        (error) => {
          this.setState({
            isLoaded: true,
            error
          });
        }
      )
  }

  render() {
    const { error, isLoaded, breweries } = this.state;
    if (error) {
      return <div>Error: {error.message}</div>;
    } else if (!isLoaded) {
      return <div>Loading...</div>;
    } else {
    return (
          <ul>
            {breweries.map(brewery => (
              <li key={brewery.id}>
              {brewery.name} {brewery.city}
              </li>
            ))}
          </ul>
     );
    }
  }
}

export default App;

这是我要获取的数据-如果将我的APIURL复制并粘贴到浏览器中，则会得到数据-因此我不确定undefined的来源：

[{"id":4581,"name":"Adirondack Toboggan Company Microbrewery","brewery_type":"micro","street":"202A W Main St","city":"Gouverneur","state":"New York","postal_code":"13642-1334","country":"United States","longitude":"-75.4748923846074","latitude":"44.3323731052224","phone":"3157716313","website_url":"http://www.adktoboggan.net","updated_at":"2018-08-24T15:37:58.899Z","tag_list":[]}, (AND SO ON)...

在我刚启动此应用程序时，我只是在尝试确保获取请求有效，以便我可以构建组件。

由于获取数据的方式（这似乎是我的其他问题的解决方案），我得到undefined还是因为其他原因阻止了我登录{{1 }} const？

React Fetch无法读取未定义的属性“ map”

0 个答案: