javascript - redux get input text value -


i have following reactjs component.

class login extends component {  render() {     if (this.props.session.authenticated) {         return (             <div></div>         );     }     return (         <div>             <input type="text" placeholder="username" />             <input type="password" placeholder="password" />             <input                 type="button"                 value="login"                 onclick={() => this.props.loginaction("admin", "password")}              />         </div>     ); } } 

the login component makes use of prop set via redux, named "session.authenticated". if user session not authenticated, present couple of input fields (one username , password) , login button. if press on login button want emit action username , password values, passed parameters. now, how values of 2 input fields parameters ?

iow, want remove hardcoded "admin, password" in above code values of 2 input fields. how achieve ?

all examples point redux-form new dependency not want add. want keep dependencies minimal , using react, redux , react-redux in project.

something this:

  class login extends component {      constructor(props){         super(props);         this.state = {            model = {               login: "",               password: ""            }         }      }   render() {       if (this.props.session.authenticated) {         return null;     }     return (         <div>             <input type="text" value={this.state.model.value.login} onchange={e => this.updatemodel(e.target.value, 'login')}placeholder="username" />             <input type="password" value={this.state.model.password }onchange={e => this.updatemodel(e.target.value, 'password')} placeholder="password" />             <input                 type="button"                 value="login"                 onclick={() => this.props.loginaction(this.state.model.login, this.state.model.password)}              />         </div>     ); }   updatemodel(value, name){     var model = extend({}, this.state.model);     model[name] = value;     this.setstate({model});   } } 

Comments

Popular posts from this blog

asynchronous - C# WinSCP .NET assembly: How to upload multiple files asynchronously -

aws api gateway - SerializationException in posting new Records via Dynamodb Proxy Service in API -

asp.net - Problems sending emails from forum -