Question

假设我有这个父母

const Parent = () => <ChildComponent foo={<Button>clic</Button>} />

为什么此代码有效

class ChildComponent extends React.Component {
    render() {
        return (
            <div>
                {this.props.foo}
            </div>
        )
    }
}

但是此代码不会吗？

class ChildComponent extends React.Component {
    constructor(props) {
        super(props)
        const ParentButton = this.props.foo
    }
    render() {
        return (
            <div>
                <ParentButton />
            </div>
        )
    }
}

我需要类似第二个示例的示例，以便向ParentButton添加一些事件。

我想使this example与类定义的组件一起工作

更新：

基于答案，我现在有了部分解决方案

class ChildComponent extends React.Component {
    constructor(props) {
        super(props)
        this.ParentButton = this.props.foo
    }
    render() {
        return (
            <div>
                {this.ParentButton}
            </div>
        )
    }
}

Answer 1

您没有将ParentButton分配给ChildComponent。

由于const，const和let关键字是函数/块作用域，因此您目前拥有的是var浮在构造函数中。

this. ParentButton = this.props.foo以及简洁的<this. ParentButton >呈现功能将为您带来帮助。

渲染react const作为组件

1 个答案: