getinitialstate was defined on app, a plain javascript class. this is only supported for classes created using react.createclass. did you mean to define a state property instead?

Description

React classes written in ES5 relied on the getInitialState() method to set a component's stateful values, React classes written in ES6 must use the constructor method to assign a component's stateful values.

Solution

React ES5 components are created using the react.createClass() method which automatically invokes the getInitialState() method to set a component's stateful values. The following snippet illustrates a React ES5 class that uses this technique.

 var BannerContainer = React.createClass({
        getInitialState: function() {
	    return {showBanner: true, message: this.props.message};
        },

When an instance of this ES5 BannerComponent component class is created, the getInitialState method is triggered and gives the component two stateful properties -- showBanner and message -- which can later be referenced and modified in other parts of the component through the state reference (e.g. this.state.showBanner, this.state.message).

React ES6 components are created using plain JavaScript classes that extend the React.Component class. Therefore when you use a plain JavaScript class to create a React component and the compiler detects a getInitialState method, it warns you it's about to set a plain state property, because it knows nothing about initializing a component's state through the getInitialState which is only valid for ES5 components (i.e. those that use the React.createClass syntax

The following snippet illustrates a modified version of the previous ES5 class, using the ES6 React.Component class that initializes a component's state via the constructor method.

class BannerContainer extends React.Component { 
        constructor(props)  {
	    super(props);
	    this.state = {showBanner: true, message: props.message};
        }

When an instance of this ES6 BannerContainer component class is created, the constructor method is triggered and gives the component two state properties -- showBanner and message -- which can later be referenced and modified in other part of the component through the state reference (e.g. this.state.showBanner, this.state.message.

As you can see, all you need to resolve getinitialstate was defined on app, a plain javascript class. this is only supported for classes created using react.createclass. did you mean to define a state property instead? is to remove the getInitialState method from a React ES6 component class that uses the React.Component class and use the React component's constructor method to assign a component stateful values.

See the section React component use of this, props and state for more details on handling a React component's stateful values in ES5 and ES6.