react-assign

ReactJS 状态更新快捷方式
授权协议 MIT
开发语言 JavaScript
所属分类 Web应用开发、 常用JavaScript包
软件类型 开源软件
地区 不详
投 递 者 萧树
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

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>
    }
  });
  • vdom diff 高效的diff算法 新老vdom树比较 更新只需要更新节点 数据变化检测 batch dom读写 组件多重继承 //parent components export default class Parent extends Component { render(){ return <div> Parent

  • var _assign = require('object-assign'); 对应es6的Object.assign合并两个对象的属性。 /* object-assign (c) Sindre Sorhus @license MIT */ 'use strict'; /* eslint-disable no-unused-vars */ // 获取对象的Symbols属性方法 var get

  • 首先说一下redux和react-redux的区别: redux是react中进行state状态管理的JS库,一般是管理多个组件中共享数据的,它并不是react的插件,是一个独立的库vue和angular等等一些框架都是可以使用的。 React-Redux是Redux的官方React绑定库。它能够使你的React组件从Redux store中读取数据,并且向store分发actions以更新数据。

  • 项目需求:react项目中,做一个可以通过鼠标拖动改变列宽的表格 第一步:安装react-resizable插件 npm install react-resizable --save 第二步:在项目中封装Resizable组件 Resizable.js import * as React from "react"; import { Table } from "antd"; import "a

  • 首先声明注意点: 1、设置列宽的width一定要用number类型。(如果不使用number类型,会出现第一次点击时卡顿的情况) 2、less中需要设置类的样式,如果无效,可以尝试加上:global(类名) 直接上demo。 index.jsx:  (展示组件) import React from "react"; import ReactDOM from "react-dom"; import

  • /* eslint-disable react/no-unstable-nested-components */ import React from 'react' import Cron from 'qnn-react-cron' import { Button } from 'antd' // 可使用 Cron.Provider 配置国际化语言 // 无需配置语言时,可不使用 Cron.P

  • 安装 npm install react-router-dom 修改index.js import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; import {BrowserRouter} from 'react-router-dom' ReactDOM.render( <R

 相关资料
  • 所以我有这个: 只是一个数组的数字例如然而没有给出正确的总数,但?我甚至放了一个超时延迟,看看这是否解决了问题。任何明显的还是我应该发布更多的代码?

  • 我正在尝试使用状态将一个表单输入值复制到另一个表单输入值,但状态没有更新 我创建了一个带有按钮的表单,其中左侧表单输入的值应复制到右侧表单输入。这是我的代码: 无论我做什么,dbSecName的状态都不会改变。我试着设置一个新的常量。我尝试使onclick函数异步并等待。如果我为我试图设置的变量的值添加,我可以正确地看到它,但是dbSecName的console.log总是显示原始值。 我真的不知

  • //你想做blog.score=5 我不知道是否还有其他的方法,但是有没有比这些更好的方法呢? 什么关于

  • 问题内容: 我在使用React表单和正确管理状态时遇到麻烦。我有一个形式为模式的时间输入字段。初始值在中设置为状态变量,并从父组件传递。这本身工作正常。 当我想通过父组件更新默认的start_time值时,就会出现问题。更新本身通过发生在父组件中。但是在我的表单中,默认的start_time值从不更改,因为它仅在中定义一次。 我尝试过通过强制进行状态更改,该更改确实有效,但给了我错误。 所以我的问

  • 说明 支付宝境外到店支付-更新商户二维码状态 官方文档:https://global.alipay.com/service/merchant_QR_Code/34 类 请求参数类 请求参数 类名:\Yurun\PaySDK\AlipayCrossBorder\InStore\ModifyStatus\Request 属性 名称 类型 说明 $service string 接口名称 $timesta

  • 我有问题的反应形式和管理的状态适当。我在一个表单中有一个时间输入字段(在一个模态中)。初始值在中设置为状态变量,并从父组件传入。这本身就很好用。 当我想通过父组件更新默认的start_time值时,问题就来了。更新本身通过在父组件中发生。但是,在我的表单中,默认的start_time值从不更改,因为它只在中定义过一次。 我尝试使用通过强制更改状态,这确实起到了作用,但给了我错误。 所以我的问题是,

  • 问题内容: 我的结构如下所示: 组件3应该根据组件5的状态显示一些数据。由于道具是不可变的,我不能简单地将其状态保存在组件1中并转发它,对吗?是的,我已经阅读了有关redux的内容,但不想使用它。我希望有可能通过反应来解决。我错了吗? 问题答案: 对于孩子与父母的通信,您应该传递一个将状态从父母设置为孩子的函数,如下所示 这样,孩子可以通过调用通过props传递的函数来更新父母的状态。 但是您将不

  • 我试图将“加载”的状态从true更改为false,但当我调用一个函数并在该函数中设置“this.setState({loading:false})”时,加载状态仍然保持true。 在下面的代码中,当按钮按钮函数被调用时,它将“加载”状态设置为真,但当用户成功登录“加载”状态时,应该变为假,这样我的渲染按钮函数将重新渲染,旋转器可以隐藏自己并显示按钮。 为什么LoginSAccess函数中的“加载”