2017-01-03 17 views
1

https://facebook.github.io/react/docs/react-component.html#setstateReact.Component SetState атомных обновления

Кроме того, можно передать функцию с подписью функции (состоянием, реквизит) => NewState. Это заносит атомное обновление , которое проверяет предыдущее значение состояния и реквизита перед установкой значений . Например, предположим, что мы хотим, чтобы увеличить значение в состоянии по props.step:

this.setState((prevState, props) => { 
    return {myInteger: prevState.myInteger + props.step}; 
}); 

Что подразумевается под атомным обновлением здесь? Разве JavaScript не является одним поточным языком? Это означает, что все обновления должны быть атомарными?

ответ

2

Одиночная резьба да, но также с большой потенциальной асинхронностью.

let atom = 10 
atom = 20 
console.log(atom) // guaranteed to be 20, so "atomic" 

// race condition 
setTimeout(() => atom = 30, Math.random() * 1000) 
setTimeout(() => atom = 40, Math.random() * 1000) 

setTimeout(() => console.log(atom), 2000) // 30? or 40? random! 

setState асинхронный вызов, так что возможно, что state изменилось с тех пор он запускается на выполнение.

Возможно, другая формулировка, которая будет применяться, заключается в том, что функция обратного вызова вносит транзакционное обновление, хотя я думаю, что любая причудливая формулировка может вводить в заблуждение. Лучше всего объяснить, что состояние, возможно, изменилось, поэтому обратный вызов имеет точный снимок предыдущего состояния.