getInitialState 是在登录面板上定义的（//我的组件的名称），一个普通的 JavaScript class

Question

你好，我对反应还很陌生，我试图消除这个错误，但对我没有任何作用。

请帮助我。我的组件是这样的。

错误是"getInitialState was defined on Loginpanel, a plain JavaScript class. This is only supported for classes created using React.createClass. Did you mean to define a state property instead?"

 export default withRouter(class Loginpanel extends React.Component{

constructor(props) {
    super(props);
    this.state= {
        datas1: [],
        NotWorking: "UserName OR Password is Wrong",
       // comments: AppStore.getAll(),
    };
}

getStateFromStore()  {
    return {
        comments: AppStore.getAll()
    }
}


componentWillMount() {



    firebase.database().ref("UserPassworddata/").once("value", (snapshot) => {

        var datas1 = []
        snapshot.forEach((data1) =>
        {

            datas1.push( {

                username: data1.val().Username,
                password: data1.val().Password,

            });

        });

        this.setState ({
            datas1: datas1,
        });

    });
}





onChange() {
    this.setState(comments);
}

getInitialState() {
    return comments;
}

componentDidMount() {
    AppStore.addChangeListener(this.onChange.bind(this));
    console.log(AppStore.addChangeListener(this.onChange.bind(this)));
}

componentWillUnmount() {
    AppStore.removeChangeListener(this.onChange.bind(this));
    console.log(AppStore.removeChangeListener(this.onChange.bind(this)));
}

checkCred(){

    //AppActions.addItem('Yes this is done by me');
    var details_array = this.state.datas1 ;
    console.log(details_array);
    for(var i=0; i < details_array.length; i++){
        var currentObject = details_array[i];
        if (this.email.value == currentObject.username && this.password.value == currentObject.password){
            console.log('yes done it');


            this.props.router.push('Index');
            AppActions.createComment(currentObject.username,currentObject.password);

            var dis = this.state.comments
            console.log(dis);

        }
        else{

            console.log('sorry man not working');
        }
    }
}

render() {

    return (
        <div>

            <Link to="/"> <button className="button1" bsStyle="primary" bsSize="large"> Login </button></Link>
            <Link to="Signup"> <button className="button1" bsStyle="primary" bsSize="large"> Signup </button></Link>



           <div id="Login">
            Email:
               <input ref={(e) => this.email = e} className="form-fields" name="email" required="required" type="email"   placeholder="User Name" /><br/>
            Password:

               <input ref={(f) => this.password = f} className="form-fields" name="password" required="required" type="password"   placeholder="Password" /><br/>
             <button onClick={this.checkCred.bind(this)} className="button1" bsStyle="primary" bsSize="large" > Submit </button>




             </div>
           </div>
         )
      }
  })

Answer 1

在 es6 class 中，您不再使用 getInitialState，而是在构造函数中使用以下内容

this.state = {
    comments: []
}

你几乎成功了！只需要删除 getInitialState 块并取消注释构造函数中的 "comments" 字段 :)

getInitialState 是在登录面板上定义的（//我的组件的名称），一个普通的 JavaScript class

getInitialState was defined on Loginpanel(//Name of my component), a plain JavaScript class

flux

reactjs

reactjs-flux

react-native