修改state(react)中的某一个对象中的单个参数

react项目中我们经常会涉及到修改state中参数的问题,如果参数为常用的基本类型变量,我们可以直接通过this.setState({...})方法来进行修改,但是如果变量为一个对象我们要如何修改呢?

我们要修改对象中的一个值或几个值而保证其它参数不会受到影响,如state中含有pagintion对象,就是我们常用的分页对象。对于这种情况我们首先想到的就是先将对象整体保存下来,然后将对象中的值修改为我们想要的值,然后再使用this.setState方法来整体赋值。于是我们就有了下面两种方法:

1、使用es6的解构赋值方法const pagination = {...this.state.pagination }获取到对象中的所有值,然后再pagination.page = 10(如修改page的值为10)来修改为成我们想要的值,最后再使用this.setState({pagination:pagination})来进行整体赋值就好了。

2、还有一种更为简洁的赋值方式就是使用Object.assign方法,直接使用 const pagination = Object.assign({}, this.state.pagination, { page: 10 })一步到位,然后再调用this.setState({pagination:pagination}),就ok了。

猜你喜欢

转载自www.cnblogs.com/yujinlong/p/11956338.html
今日推荐