react class类通过document添加class类名

可以通过以下代码实现：

class MyComponent extends React.Component {
  componentDidMount() {
    document.body.classList.add("my-class");
  }

  render() {
    return <div>Hello World</div>;
  }
}

在组件挂载后，`componentDidMount` 方法会被调用，此时可以通过 `document.body` 获取到整个页面的 `body` 元素，然后调用 `classList.add` 方法来添加一个新的类名。这样就可以在页面中添加一个名为 `my-class` 的类了。

相关问题

怎么拿到动态渲染的类名

在JavaScript中，如果你想获取动态渲染元素的类名，通常可以使用`classList`属性。这个属性允许你操作元素的类列表，包括添加、删除和检查类名是否存在。

例如，如果你有一个元素，你可以这样做：

var element = document.getElementById('yourElementId');
var className = element.classList.toString(); // 获取所有类名组成的字符串
console.log(className); 

// 如果你想获取特定的类名是否存在
if (element.classList.contains('dynamicClass')) {
    console.log('Dynamic class is present.');
}

// 如果你想动态设置或删除类名
element.classList.add('newClassName'); // 添加新类名
element.classList.remove('oldClassName'); // 删除旧类名

在React等框架中，也可以通过`ref.current.className`来访问组件实例的类名。

class App extends React.Component { state = { month: '三月', day: '28', once: '学习React', twice: '40分钟' } render () { return ( <div className="one"> <div className="two"> <div className="date"> <div className="month">{this.state.month}</div> <div className="day">{this.state.day}</div> </div> <div className="content"> <div className="once">{this.state.once}</div> <br/> <div className="twice">{this.state.twice}</div> </div> </div> </div> ) } } ReactDOM.render(<App />, document.getElementById('root'))

这是一个 React 组件，它会在页面上渲染一个日历和待办事项列表。组件中的 state 包含了月份、日期、一次性任务和二次性任务。在 render 方法中，通过 JSX 语法将这些数据渲染到了页面上。其中，className 用于指定样式类名，div 标签用于表示页面上的元素。最后，通过 ReactDOM.render 方法将组件渲染到了页面上。