javascript - 类型错误 : Cannot read property 'map' of undefined in ProductList. js

Question

这个问题已经问过，但我不明白，因为我是 React Js 的新手。

我尝试使用 react js 列出所有产品，但它显示以下错误

这是我的ProductList.js代码

import React, { Component } from 'react'

class ProductList extends Component {
    state = {
        products : []
    }

    componentDidMount(){
        this.getProducts()
    }

    getProducts = _=>{
        fetch('http://localhost:2020/productList')
        .then(response => response.json())
        .then(response => this.setState({products : response.data}))
        .catch(err=>console.error(err))
    }

    renderProduct = (_id, productName) => <div key={_id}>{productName}</div>

    render() {
        const { products } = this.state;

        return (
            <div className="container">
                <h1>Product List</h1>
                <div>
                    { products.map(this.renderProduct) }
                </div>
            </div>
        )
    }
}
export default ProductList

帮我解决这个问题。

Please suggest me Node js + React js + mongoDB tutorials.

Answer 1

使用这个:产品&&产品.map