React怎么修改nodeValue

在React中，如果你想要动态地修改HTML元素的nodeValue（即文本内容），通常是在组件的状态(state)中管理这部分数据，然后通过JavaScript操作DOM。但是需要注意的是，React推荐使用更高效和更安全的方式——只更新真正改变的部分，而不是直接操作DOM。

例如，假设有一个简单的`TextComponent`：

class TextComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = { textValue: '' };
  }

  updateText(newText) {
    this.setState({ textValue: newText });
  }

  render() {
    return (
      <div>
        <span ref={el => this.textNode = el} dangerouslySetInnerHTML={{ __html: this.state.textValue }} />
        <button onClick={() => this.updateText('新的文本')}>
          修改文本
        </button>
      </div>
    );
  }
}

在这个例子中，我们创建了一个ref `textNode` 来引用DOM元素，并在`render`方法中使用`dangerouslySetInnerHTML`属性来设置其值。当按钮被点击时，会触发`updateText`函数，更新状态并间接更新DOM。

然而，`dangerouslySetInnerHTML`不是最佳实践，因为它涉及到直接操作HTML字符串，可能会引入安全隐患。在实际应用中，你可以考虑使用`textContent`或者`innerHTML` API，但在处理用户输入或不确定的数据时，最好先转义。