ReactJS 状态更新快捷方式 react-assign

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/phj_88/article/details/82141732

react-assign 不需要任何引用就可以更新 ReactJS 状态。react-assign 是轻量级 React 类状态更新快捷方式,不需要专门定义一个函数处理器。

常规更新:

var React = require('react');
  React.createClass({
    getInitialState() {
      return {
        username: "",
        password: ""
      };
    },
    updateName(e) {
      var newName = e.target.value;
      this.setState({
        "username": newName
      });
    },
    updatePass(e) {
      var newPass = e.target.value;
      this.setState({
        "password": newPass
      });
    },
    render() {
      <div>
        <input type="text" onChange={this.updateName}/>
        <input type="password" onChange={this.updatePass}/>
      </div>
    }
  });

使用 react-assign:

var React = require('react');
  var assignValue = require('react-assign');
  React.createClass({
    getInitialState() {
      return {
        username: "",
        password: ""
      };
    },
    render() {
      <div>
        <input type="text" onChange={assignValue(this, "username")}/>
        <input type="password" onChange={assignValue(this, "password")}/>
      </div>
    }
  });

博主花大量时间和精力整理了大前端最新前端视频教程,省去大家找资源的时间

有兴趣的可以点击下方文字访问博主淘宝网(感谢支持)或直接联系博主QQ:184009766

点击我,支持博主,前端视频教程

猜你喜欢

转载自blog.csdn.net/phj_88/article/details/82141732