Alimin
Alimin

Reputation: 2727

How to add class to element in reactjs?

I do following statement to add 'hold-transition login-page' class to the <body id='the_body'> element

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>
)
}

but I get this error

InvalidCharacterError: String contains an invalid character
componentDidMount

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

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

it is running well. but why my dom statement is error?. finaly I hope you to fix my problem, thank you

Upvotes: 0

Views: 3607

Answers (1)

lastr2d2
lastr2d2

Reputation: 3968

This is not how people modify classes with React but the problem in your example is that "hold-transition login-page" is not a valid class name.

If you want to add multiple class names you should try

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

Upvotes: 1

Related Questions