如何在ReactJS中的元素上添加类？

如何解决如何在ReactJS中的元素上添加类？

我执行以下语句以将'hold-transition login-page'类添加到<body id='the_body'>元素

import React,{ Component,useEffect } from 'react';
export default class Login extends React.Component {
componentDidMount() {
document.getElementById("the_body").classList.add('hold-transition login-page')
}
render() {
return(
<div className="login-Box">
...some html script
</div>
)
}

但是我得到这个错误

InvalidCharacterError: String contains an invalid character
componentDidMount

I am already make simple javcript code inside  `componentDidMount()`

componentDidMount(){
 alert('test javascript inside jsx');
}

运行良好。但是为什么我的dom陈述是错误的？最后，希望您能解决我的问题，谢谢

解决方法

这不是人们使用React修改类的方式，但是您的示例中的问题是“ hold-transition login-page”不是有效的类名。

如果要添加多个类名，则应尝试

classList.add("hold-transition","login-page")