StrictMode

Advertisement

StrictMode highlighting problems in an application.

IMP: Strict mode checks are run in development mode only;

IMP: they do not impact the production build.


import ReactDOM, { findDOMNode } from 'react-dom';
import React, { Component, StrictMode } from 'react';

class App extends Component {
	constructor() {
		super();
		this.state = { count: 0 };
	}

	componentDidMount() {
		const node = findDOMNode(this);

		// Set red color to our <h1> tag.
		node.style.color = 'red';
	}

	render() {
		return (
			<StrictMode>
				<h1>Heading</h1>
			</StrictMode>
		)
	}
}

export default App;

he `findDOMNode()` method is DEPREACTED for that we get the Warning with `<StrictMode>`

In above example we can see the error:

Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of App which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-find-node

%d bloggers like this: