时间戳

首页 > 解决方案 > 未调用反应状态更改 lambda 函数代码

reactjs - 未调用反应状态更改 lambda 函数代码

问题描述

在 render() 函数中，我将一些代码存储在 const "success" 中。但是即使状态发生了变化，下面的 Card.Footer 标签之间对“成功”的引用也永远不会被调用。原因是什么？

 render() {

let fields = this.props.fields.map(field => {

    return(
    <Form.Group controlId={field.col}>
      <Form.Row>
        <Form.Label>{field.label}</Form.Label>
        <Form.Control required={field.required} type="text" placeholder={field.label} />
      </Form.Row>
    </Form.Group>
    )
});

const success = () => {
    console.log('B');
    return(<small>Operation {this.props.operation} succeded.</small>);

    if(this.state.dml_success) {

    return(

        <div>Operation {this.props.operation} succeded.</div>
    )
    }
};

console.log('C');

return(
    <Card style={{ width: '18rem', backgroundColor: 'lightgrey' }}>
      <Card.Body>
    <Card.Title>{this.props.title}</Card.Title>
    <Card.Text>
      <Form onSubmit={this.dml.bind(this)}>
        {fields}
        <Form.Row>
          <Button variant="primary" type="submit">
        {this.props.operation}
          </Button>
        </Form.Row>
      </Form>
        </Card.Text>
      </Card.Body>
      <Card.Footer className="text-muted">{success}</Card.Footer>
    </Card>     
)
}

}

标签： reactjsreact-bootstrap

解决方案

您已将成功定义为函数，因此您需要添加括号

{success()}

推荐阅读