ReactJS: Page update after login -
im new reactorjs, trying develop simple login example. in example after button click page not updating new component. when click submit button should update page regardless of user credentials.
var userauthentication = react.createclass({ getinitialstate: function() { return {signin: false}; }, handlesubmit: function() { this.state.signin = true; }, render: function() { return ( <div> {(this.state.signin ? <user /> :<form> <div classname="usernamein"> <label>username :</label> <input type="text" ref="username"/> </div> <div classname="userpasswordin"> <label>password :</label> <input type="password" ref="userpassword"/> </div> <div> <button type="submit" onclick= this.handlesubmit}>sign in</button> </div> </form> )} </div> ); } }); var user = react.createclass({ render: function() { return ( <div classname="username"> <label>user in...</label> </div> ); } });
firstly, better practice put handler not on click action of submit button, on form — by passing onsubmit prop. way triggered not button press, also, example, pressing enter on form field.
<form onsubmit = { this.handlesubmit }> {...} </form>
secondly, setting state object 1 want won't — react doesn't work way , ignore statement. have use setstate function, this:
handlesubmit: function() { this.setstate({ signin: true }); }
Comments
Post a Comment