关于React中setState回调函数

一般来说,React中只有通过setState方法才能改变页面初始时设置的state状态,并对页面进行从新渲染。其中,对页面的一些参数进行修改的时候,也可以使用setState的回调函数。setState(updater[, callback])

区别分析

0.初始状态

this.state = {
    test: 'test'
}

1.不使用回调函数

this.setState({
    test: 'hello world!'
});
console.log('1', this.state.test);
// 1, test

2.使用回调函数

this.setState({
    test: 'hello world!'
}, () => {
    console.log('2', this.state.test);
    // 2, hello world!
});

分析总结
1. updater是要改变的state对象,callback是state导致的页面重新渲染的回调,等价于componentDidUpdate.
2. 此处一定注意,setState是异步的,不保证数据的同步。
3. setState更新状态时可能会导致页面不必要的重新渲染,影响加载。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值