在React中经常会使用到setState,因为在react生态中,state就是一切.在开发过程中,时长会在state中遇到一些比较复杂的数据结构,类似下面这样的:

这时需要我们修改listobjA中的name属性和objD的属性,遇到这样的情况我们一般会使用什么办法解决呢?其实有三种解决方案:

方案一(作用于对象中的深层级和第一层级)

方案二(作用对象中的第一层级):

方案三(作用于对象中的深层级和第一层级):

总结:

| 方案 | 适用范围 | 缺点
| :-: | :-: | :-: |
| 方案一 |多层级和单一层级都存在 | 写法麻烦,单次对象赋值,对象层级多的时候,容易遗漏
| 方案二 |只适用与第一层级 | 只适用第一层级
| 方案三 |多层级和单一层级都存在 | 若存在深层及和单一层级的,需要多次赋值

这三种写法都可以,使用哪一种方案,还需要根据业务来定。

React中setState如何修改深层对象?的更多相关文章

  1. React中setState学习总结

    react中setState方法到底是异步还是同步,其实这个是分在什么条件下是异步或者同步. 1.先来回顾一下react组件中改变state的几种方式: import React, { Compone ...

  2. React中setState同步更新策略

    setState 同步更新 我们在上文中提及,为了提高性能React将setState设置为批次更新,即是异步操作函数,并不能以顺序控制流的方式设置某些事件,我们也不能依赖于this.state来计算 ...

  3. React中setState的怪异行为 ——setState没有即时生效

    setState可以说是React中使用频率最高的一个函数了,我们都知道,React是通过管理状态来实现对组件的管理的,当this.setState()被调用的时候,React会重新调用render方 ...

  4. React中setState 什么时候是同步的,什么时候是异步的?

    class Example extends React.Component { constructor() { super(); this.state = { val: 0 }; } componen ...

  5. react中setState用法

    setState()更新状态的2种写法 setState(updater, [callback]), updater为返回stateChange对象的函数: (state, props) => ...

  6. React中setState方法说明

    setState跟新数据是同步还是异步? setState跟新数据是异步的. 如何用代码表现出来是异步的. 点击按钮更新数据,然后去打印这个值看一下 setState跟新数据是异步的 class Fa ...

  7. React中setState注意事项

    setState是一个异步函数,异步获取数据 学习react在使用ref和setState操作DOM时会遇到的问题: ref获取ul结点元素 错误写法:得到的ul长度总是上一次输入后的长度 结果: 正 ...

  8. 「React Native笔记」在React的 setState 中操作数组和对象的多种方法(合集)

    运用在React 中 setState的对象.数组的操作时是不能用类似array.push()等方法,因为push没有返回值,setState后会出现state变成Number,为了方便他人和自己查看 ...

  9. React中diff算法的理解

    React中diff算法的理解 diff算法用来计算出Virtual DOM中改变的部分,然后针对该部分进行DOM操作,而不用重新渲染整个页面,渲染整个DOM结构的过程中开销是很大的,需要浏览器对DO ...

随机推荐

  1. Github排名靠前的iOS库

    //iOS第三方开源库的吐槽和备忘 http://blog.ibireme.com/2013/09/23/ios-third-party-libs/#more-41361 //整理了一份Github上 ...

  2. 设置滑动TabBar的显示和隐藏

    代码如下: //设置滑动的判定范围 - (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint ...

  3. php关于文件上传的两个配置项说明

    ; Maximum allowed size for uploaded files.; http://php.net/upload-max-filesizeupload_max_filesize = ...

  4. Cognos Framework操作记录

    备注:这是我单位内部的Cognos Framework配置记录,里面涉及的名字等信息在其他使用环境需要进行相应修改. Cognos数据包配置 打开CYFTest项目, 右键点击andwdb的物理视图 ...

  5. 简单的api实现以及动态函数调用

    实现一个简单的api功能,环境python2.7 请求方法:curl http://ip:8000/?name={api中的方法名}|python -m json.tool 只需编写api的方法即可 ...

  6. 泰乐事(Telos)白皮书中文版 <零> 封面及目录

    <泰乐事白皮书> 一个可持续发展的去中心化EOSIO网络 作者:道格拉斯·合恩 泰乐事(Telos)—— 事物的终极目标. Telos一词来源于希腊语ΤΈΛΟΣ. “一颗橡果的终极目标是成 ...

  7. 最新 珍岛java校招面经 (含整理过的面试题大全)

    从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿.珍岛等10家互联网公司的校招Offer,因为某些自身原因最终选择了珍岛.6.7月主要是做系统复习.项目复盘.LeetCode ...

  8. php 将图片文件转成base64编码的方法

    php 将图片文件转成base64编码的方法<pre><?php /** 文件转base64输出 * @param String $file 文件路径 * @return Strin ...

  9. 乐字节Java反射之一:反射概念与获取反射源头class

    一.Java反射机制概念 “程序运行时,允许改变程序结构或变量类型,这种语言称为动态语言”,如Python, Ruby是动态语言:显然C++,Java,C#不是动态语言,但是JAVA有着一个非常突出 ...

  10. Java 日期格式工具类

    Java 日期格式工具类 方法如下 DateUtil 类 import java.text.DateFormat; import java.text.ParseException; import ja ...