CODEWITHSUNDEEP
javascriptreactjsdom
Jiayang
Jiayang

Reputation: 778

Does React DOM have to use className? Why am I not seeing any warnings?

I've been trying out React on a project for weeks now. And I just remembered that I should use className instead of class in regular DOM and SVG, because class is a reserved keyword in JS.

However, all my components are using classso far. For example:

export default class Header extends React.Component {
    render() {
        return (
            <div class="Header">
                <img class="Logo" src="./interface/images/ea-white.png"/>
                <h1 class="Title">{this.props.title}</h1>
            </div>
        );
    }
}

Why haven't I got any syntax error? Does React DOM have to use className? What could happen if I keep it this way?

Edit: Yes, the CSS files worked normally all this time. There's no warning in my console (which is weird).

Upvotes: 2

Views: 1925

Answers (2)

Kyle Richardson
Kyle Richardson

Reputation: 5645

It currently works, but React will throw a warning in your console. I would recommend using className considering this is what React wants you to do. If you continue to use class, there may be a time when React stops supporting this.

Upvotes: 3

Nikhil Fadnis
Nikhil Fadnis

Reputation: 860

React throws a warning when you use an unknown property such as class on an element.

It also points to the source line number, thanks to this pr https://github.com/facebook/react/pull/6398

Upvotes: 2

Related Questions