reactjs - props.data.map 在我的组件中不起作用

Question

我正在学习反应，我也是 JS 的新手，有人可以告诉我为什么 .map 函数在一个组件中起作用，但在另一个组件中不起作用？

地图在这个组件中运行良好

import React from 'react';
import Card from './card';
import '../memoryGameStyle/cardList.css';

const CardList =(props)=>{
    const card=props.cards.map((c,i)=>(
        <Card
            key={i}
            card={c}
            cards={props}
        />
    ))
    return(
        <div className='card-list'>
            {card}
        </div>
    )
}

export default CardList;

但它在这个组件中不起作用

import React from 'react';
import '../memoryGameStyle/card.css';

class Card extends React.Component{
    constructor(props){
        super(props);
        const {hidden,show,id,r,g,b}=this.props.card
        this.state={...}
        const style='';
    }

    componentWillReceiveProps(){...}

    onClick=()=>{
        const {id}=this.props.card
        this.setState({hidden:false})
        this.setState({show:true})
        const cards=this.props.cards.map((card,i)=>{
            console.log(card)
        })
    }
render(){...}

我每次都有这个错误

Answer 1

您正在向Card组件发送不正确的数据。

改变

<Card
  key={i}
  card={c}
  cards={props}
/>

至

<Card
  key={i}
  card={c}
  cards={props.cards}
/>

希望，你发现了错误。