Question

我想创建一个类，在将一个react.js文件加载到使用react指定的div中时，我没有发现任何与网上相关的内容。

Answer 1

检查此示例：

假设您有2个组件App and Child，并希望在选中复选框时render子组件，这称为conditional rendering。

app.js 文件，在child.js组件中导入文件App：

import Child from './child';

class App extends React.Component {
    constructor() {
        super();
        this.showComments = this.showComments.bind(this);
        this.state = {
            showComponent: false,
        };
    }

    showComments(e) {
        this.setState({
            showComponent: e.target.checked,
        });
    }

    render() {
           return (
                <div className="add_checkbox">
                   <span>Enable Comments</span>
                   <input className="checkbox" type="checkbox" name="enable_comment" onClick={this.showComments} value="enable_comment"/>
                   {this.state.showComponent ? <Child/>  : null}
                </div>
        )
    }
}

child.js 档案：

export default class Child extends React.Component{
   render(){
       return(
          <div>Hello</div>
       );
   }
}

ReactDOM.render(<App />, document.getElementById('container'));

点击fiddle查看工作示例：https://jsfiddle.net/ztx9kd1w/

如果您需要帮助，请告诉我。

单击按钮，使用by加载React

1 个答案: