Question

我可以在onClick中的reactjs - 事件中创建新组件吗？我试过这个：

发生点击事件的组件：

...
<li onClick={this.edit.bind(this)}><span className="glyphicon glyphicon-pencil"></span> Edit entry</li>
...

这是edit方法：

 edit(event) {
        return <CreateFreightEntryModal key={"freightEditModal" + this.state.freight.ID} openOnStartup="true" modalId={"freightEditModal" + this.state.freight.ID} />
    }

不会引发任何错误，但未创建组件。我做错了什么或者这不是真的推荐？

Answer 1

在反应中，由于它的本质，显示模态有点棘手。

edit() {
    this.setState({ showModal: true })
}

render() {

    return (
        <div>
             { this.state.showModal && <CreateFreightEntryModal props/> }
        </div>
    )

}

Answer 2

你最好用@Ozgur GUL中的状态渲染组件状态答案。

但是，如果你必须动态渲染某些东西，你可以这样做。

import ReactDOM from 'react-dom';

...
edit() {
  ReactDOM.render(<CreateFreightEntryModal key={"freightEditModal" + this.state.freight.ID} openOnStartup="true" modalId={"freightEditModal" + this.state.freight.ID} />);
}

React - 返回组件onClick事件

2 个答案: