我不断收到此错误:TypeError:data.map不是一个函数

时间:2020-04-30 07:36:36

标签: django reactjs

我正在尝试使用django创建一个网站并作出反应,但是当我尝试查看它时,我不断收到此错误TypeError: data.map is not a function。下面是我的代码,我似乎不知道问题所在

我正在尝试使用django创建一个网站并做出反应,但是当我尝试查看它时,我不断收到此错误TypeError:data.map不是一个函数。下面是我的代码,我似乎不知道问题所在

class ProductList extends React.Component {

    state = {
        loading: false,
        error: null,
        data: []
      };

      componentDidMount() {
        this.setState({ loading: true });
        axios
          .get(productListURL)
          .then(res => {
            this.setState({ data: res.data, loading: false });
          })
          .catch(err => {
            this.setState({ error: err, loading: false });
          });
      }

      render() {
        const { data, error, loading } = this.state;
        return (
          <Container>
            {error && (
              <Message
                error
                header="There was some errors with your submission"
                content={JSON.stringify(error)}
              />
            )}
            {loading && (
              <Segment>
                <Dimmer active inverted>
                  <Loader inverted>Loading</Loader>
                </Dimmer>

                <Image src="/images/wireframe/short-paragraph.png" />
              </Segment>
            )}
                <Item.Group divided>

                     {data.map(item => {
                        return <Item key={item.id}>
                                    <Item.Image src={item.image} />

                                    <Item.Content>
                                        <Item.Header as='a'>{item.title}</Item.Header>
                                        <Item.Meta>
                                        <span className='cinema'>{item.category}</span>
                                        </Item.Meta>
                                        <Item.Description>{item.description}</Item.Description>

                                    </Item.Content>
                                </Item>
                    })}
                </Item.Group>
            </Container>
            );
        }
    }

export default ProductList```

0 个答案:

没有答案