javascript - React component unmounted -
my react app routes so:
<route handler={routehandler}> <route name="welcome" path="welcome" handler={welcomepage} /> <route name="app" path="/" handler={application}> <route name="some-page" path="some-page" handler={somepage} /> </route> </route>
the main "app" layout following
export default class application extends react.component { render() { return (<div> <modalview /> <topbar /> <routehandler /> </div>); } }
the topbar giving me problems:
export default class topbar extends react.component { componentdidmount() { userstore.addchangelistener(this._onchange); } componentwillunmount() { userstore.removechangelistener(this._onchange); } _onchange = () => { this.setstate(this.getstate()); }; handleloginclick() { actions.queuemodal("login"); } handlesignupclick() { actions.queuemodal("signup"); } getstate() { return { currentuser: userstore.currentuser }; } state = this.getstate(); render() { return ( <div classname="topbar"> {this.state.currentuser ? (<link to="home"><button classname="default">{this.state.currentuser.email}</button></link>) : ([ <button key={1} classname="clear" onclick={this.handlesignupclick}>sign up</button>, <button key={2} classname="clear" onclick={this.handleloginclick}>log in</button> ])} </div> ); } }
according "app" layout, topbar should mounted when in some-page. when complete login, userstore emits change, received topbar. instead of bar updating itself, error message "warning: setstate(...): can update mounted or mounting component. means called setstate() on unmounted component. no-op." why this?
it dont have initial state component topbar. try set intial state in contructor .
constructor(props) { super(props); this.state = {name: props.name}; }
Comments
Post a Comment