Question

我的React应用程序有一个像这样的基本div：

<body>
    <div id="root">
        ....
    </div>
</body>

在我的Welcome容器中，我想在div w id =＆＃34; root中添加一个类，然后在Welcome容器卸载时删除该类。

class Welcome extends React.Component {

  componentDidMount() {
    console.log('componentDidMount');
    console.log($('#root'));
  }
  ....

使用jQuery我可以做类似

的事情

$('#root').addClass('myClass')
....
$('#root').removeClass('myClass')

React在找到div的类后，在它的ID上找到它的等价物是什么？

由于

Answer 1

这没有任何意义。您不应该从React组件向root添加类。应该存在根div，以便使用ReactDOM注入React。

不是修改html根目录，而是创建一个名为App或类似物的反应类，并渲染一个包裹所有组件的<div className="app" />。然后，您可以使用React状态或props来修改className。

class App extends React.Component {
    constructor() {
        super();

        this.state = {
            appClass: 'myClass'
        };
    }

    componentDidMount() {
        this.setState({ appClass: 'newClass' });
    }

    render() {
        return (
            <div className={this.state.appClass}>
                // Render children here
            </div>
        );
    }
}

如果要从应用程序中较低的appClass子组件修改Welcome，则需要使用Redux或Flux等状态管理来修改className。一个儿童组成部分，否则会很快乱。

编辑：从this.state对象中删除分号

如何在React组件挂载上添加一个类？

1 个答案: