Javascript 渲染既不是由setState（）触发，也不是由forceUpdate（）触发

我有一个简单的React设置，看起来像这样：

index.js

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

export default class App extends Component {
    constructor(props) {
        super(props);

        this.state = {
            flag: false
        };
    }

    update = () => {
        // changing DOM to test if re-render occurs
        document.getElementById('test').innerHTML = '';

        this.setState({
            flag: true
        });

        this.forceUpdate();
    };

    render() {
        return(
            <table id="test">
                <tbody>
                <tr key="new">
                    <td>Row foo</td>
                    <td>Row bar</td>
                    <td>{this.state.flag ? 'Row foobar' : 'Row barfoo'}</td>
                </tr>
                </tbody>
            </table>
        );
    }
}

---

ReactDOM.render（
通过查看您的尝试，我可以说您没有正确理解

 <强>让我们考虑一下你的情况， 
您渲染了一个组件，文本显示在网页上，然后单击按钮并更改渲染文本，同时执行
setState
。现在您希望重新渲染初始渲染文本

现在让我纠正一下，

在第一次执行
setState
之前，您的组件会经历一些生命周期方法，组件
会装载
。当
setState
执行时，您的组件会经历另一组生命周期方法。这两个阶段完全不同

组件的状态由
React
维护。因此，在此阶段所做的任何更改都将持续到组件卸载为止

要查看初始数据，您必须重新加载浏览器或进行某种导航。
@SultanH。您能否提供一个简短的示例作为答案？我将不胜感激。您能否向我们展示您的
渲染（）
App.js中的
方法
？React建议不要直接进行DOM操作，它发生在React的虚拟DOM之外，因此它不会像您尝试的那样处理它。此外，如果您调用
forceUpdate
，则几乎有10/10次您是在“反应”错误，通常表示生命周期函数中存在逻辑错误。此外，您可以使用事件侦听器
document.getElementById（“测试”）通过
onClick
prop.button将处理程序直接附加到按钮.textContent
这将直接对DOM进行更改，而react在本例中不涉及。我理解-如何实现实际的重新呈现，就像第一次加载页面一样？
componentWillMount
是在组件装载之前执行的方法。在该方法中，您可以使用一些预呈现逻辑。您的布局ut应始终表示当前状态。因此，如果要实现页面第一次加载时的重新呈现，则需要将状态重置为初始状态。