Javascript 反应：在类之间传递道具总是未定义的

我试图将一个简单的列表从父类传递给子类，但“props”始终未定义。我在这里做了研究，尝试了几种方法，但结果总是一样：“未定义”。 如何获取分配给子类状态中相应字段的卡片列表？（显然，这是我的第一步）

游戏类（家长）

从“React”导入React；
从“/Hand/Hand”导入手；
设hand1=[{id:1，value:5}，{id:2，value:4}，{id:3，value:1}]；
导出默认类游戏扩展React.Component{
静态初始状态=（）=>({
deckId:getDeckId
});
render（）{
返回(


);
}
}

手工课（儿童）

从“React”导入React；
从“/./卡/卡”导入卡；
常数翻转=卡=>{
这是我的国家(
prevState=>({
flippedCards:prevState.flippedCards.concat（卡片）
}),
这个是sumCards（）
);
};
常数翻转=卡=>{
这是我的国家(
prevState=>({
flippedCards:prevState.flippedCards.filter（c=>c.id！==card.id）
}),
这个是sumCards（）
);
};
const CardList=props=>{
返回(
{props.cards.map（card=>(
))}
);
};
导出默认类。组件{
建造师（道具）{
超级（道具）；
console.log（props）；//这始终是未定义的
此.state={
卡片：道具，卡片，
翻转卡片：[]，
电流总和：0
};
}
sumCards=（）=>{
this.setState（prevState=>({
currentSum:prevState.flippedCards.reduce(
（acc，card）=>card.value+acc，
0
)
}));
};
render（）{
返回(
{this.state.currentSum}
);
}
}

hand1

是一个未分配给父类

游戏
范围内的
此
上下文的变量。可以将其值直接用作道具值：

import React from 'react';
import Hand from './Hand/Hand';

let hand1 = [
  {id: 1, value:5},
  {id: 2, value:4},
  {id: 3, value:1}
]

export default class Game extends React.Component {
  static initialState = () => ({
    deckId: getDeckId
  });
  render() {
    return (
      <div className="container">
        <div className="row">
            <Hand cards={hand1}/>
        </div>    
      <br />
      </div>
    );
  }
}

从“React”导入React；
从“./手/手”导入手；
让hand1=[
{id:1，值：5}，
{id:2，值：4}，
{id:3，值：1}
]
导出默认类游戏扩展React.Component{
静态初始状态=（）=>({
deckId:getDeckId
});
render（）{
返回(


);
}
}

为了能够以您首先尝试的方式传递值，您应该在类构造函数中定义它

export default class Game extends React.Component {
  constructor(props){
    super(props);
    this.hand1 = [
      {id: 1, value:5},
      {id: 2, value:4},
      {id: 3, value:1}
    ];
  }

  static initialState = () => ({
    deckId: getDeckId
  });

  render() {
    return (
      <div className="container">
        <div className="row">
            <Hand cards={this.hand1}/>
        </div>    
      <br />
      </div>
    );
  }
}

导出默认类Game.Component{
建造师（道具）{
超级（道具）；
此.hand1=[
{id:1，值：5}，
{id:2，值：4}，
{id:3，值：1}
];
}
静态初始状态=（）=>({
deckId:getDeckId
});
render（）{
返回(


);
}
}
hand1
是一个未分配给父类
游戏
范围内的
此
上下文的变量。可以将其值直接用作道具值：

import React from 'react';
import Hand from './Hand/Hand';

let hand1 = [
  {id: 1, value:5},
  {id: 2, value:4},
  {id: 3, value:1}
]

export default class Game extends React.Component {
  static initialState = () => ({
    deckId: getDeckId
  });
  render() {
    return (
      <div className="container">
        <div className="row">
            <Hand cards={hand1}/>
        </div>    
      <br />
      </div>
    );
  }
}

从“React”导入React；
从“./手/手”导入手；
让hand1=[
{id:1，值：5}，
{id:2，值：4}，
{id:3，值：1}
]
导出默认类游戏扩展React.Component{
静态初始状态=（）=>({
deckId:getDeckId
});
render（）{
返回(


);
}
}

为了能够以您首先尝试的方式传递值，您应该在类构造函数中定义它

export default class Game extends React.Component {
  constructor(props){
    super(props);
    this.hand1 = [
      {id: 1, value:5},
      {id: 2, value:4},
      {id: 3, value:1}
    ];
  }

  static initialState = () => ({
    deckId: getDeckId
  });

  render() {
    return (
      <div className="container">
        <div className="row">
            <Hand cards={this.hand1}/>
        </div>    
      <br />
      </div>
    );
  }
}

导出默认类Game.Component{
建造师（道具）{
超级（道具）；
此.hand1=[
{id:1，值：5}，
{id:2，值：4}，
{id:3，值：1}
];
}
静态初始状态=（）=>({
deckId:getDeckId
});
render（）{
返回(


);
}
}
Wow！那很容易。谢谢@Dez，我会尽快接受你的回答！那很容易。谢谢@Dez，我会尽快接受你的回答