历史记录.push（）在发送数据时不起作用

Question

我在“主要”组件中将路线定义为：

<Route path="/user/:action?/:name?" component={DataForm} />

MainDataCard组件：

var data = [ {name: 'abc", label: "ABC", path:"/assets/data/source1.jpg" }, 
             {name: 'pqr", label: "PQR", path:"/assets/data/source2.jpg" },
             {name: 'xyz", label: "XYZ", path:"/assets/data/source3.jpg" },
]

我正在遍历一个数据数组和每个卡的onClick，我将导航到另一个组件DataForm。推动时，我需要发送选定的卡对象。

{data.map((card, index) => {
        return (
          <Card
            key={index}
            className="cardStyle"
            onClick={() => {
              this.onClickForm(card);
            }}
          >
            <CardContent className="cardContent">
              <Grid container>
                <Grid item md={12}>
                  <img src={card.path} alt="card" />
                </Grid>
                <Grid item md={12}>
                  <Typography color="textSecondary" gutterBottom>
                    {card.name}
                  </Typography>
                </Grid>
              </Grid>
            </CardContent>
          </Card>


       onClickForm = card => {
          const {action} = this.props;  // action value can be add/update. Currently action = "add"
          this.props.history.push({
          pathname: `/user/${action}/${card.label}`,
         state: { card: card }
          });
        };

在DataForm组件中，其显示未定义卡。这意味着数据没有被发送到DataForm组件。为什么会这样？

谢谢。