zoukankan      html  css  js  c++  java
  • react 总结

    1、React 里直接修改 this.state 和调用 setState() 修改 state 的值有什么区别?

    使用对this.state赋值并没有什么作用,官方提醒,应该把this.state当成不可变变量。
    而使用this.setState方法,会触发异步修改状态,状态改变的同时,会重新执行一次willUpdate,render等流程。需要注意的是,避免在执行完this.setState后马上读取this.state,此操作并不会获得最新修改的状态。

    2、组件渲染

    function Welcome(props) {
    return <h1>Hello, {props.name}</h1>;
    }

    const element = <Welcome name="Sara" />;
    ReactDOM.render(
    element,
    document.getElementById('root')
    );

    1)我们对<Welcome name="Sara" />元素调用了ReactDOM.render()方法。
    2)React将{name: 'Sara'}作为props传入并调用Welcome组件。
    3)Welcome组件将<h1>Hello, Sara</h1>元素作为结果返回。
    4)React DOM将DOM更新为<h1>Hello, Sara</h1>。

    3、react-表单-多个输入的解决方法

    this.setState({
      [name]: value
    });

    相当于如下ES5语法
    var partialState = {};
    partialState[name] = value;
    this.setState(partialState);

    同样由于 setState() 自动将部分状态合并到当前状态,因此我们只需要使用发生变化的部分调用它。
  • 相关阅读:
    WebApi实现自定义错误日志
    WebApi实现IHttpControllerSelector问题
    动态属性ExpandoObject
    SQL远程连接
    HTML空格占位
    SQL生僻字模糊查询
    python中的字符串
    idea闪退
    lineNumber: 1; columnNumber: 1; 前言中不允许有内容。
    linux下后台启动weblogic
  • 原文地址:https://www.cnblogs.com/smght/p/8430652.html
Copyright © 2011-2022 走看看