setState против replaceState в React.Яш

я новичок реагировать.библиотека js, и я просматривал некоторые из учебников, и я наткнулся:

  • this.setState
  • this.replaceState

приведенное описание не очень ясно (IMO).

setState is done to 'set' the state of a value, even if its already set 
in the 'getInitialState' function.

аналогично,

The replaceState() method is for when you want to clear out the values 
already in state, and add new ones.

пробовал this.setState({data: someArray}); следовал по this.replaceState({test: someArray}); а потом консоль.зарегистрировал их, и я нашел это state теперь оба data и test.

тогда я попробовал this.setState({data: someArray}); следовал по this.setState({test: someArray}); а потом консоль.зарегистрировал их, и я нашел это state снова оба data и test.

Итак, в чем именно разница между ними ?

3 ответов


С setState текущее и предыдущее состояния объединяются. С replaceState, он выбрасывает текущее состояние и заменяет его только тем, что вы предоставляете. Обычно setState используется, если вам действительно не нужно удалять ключи по какой-либо причине; но установка их в false/null обычно является более явной тактикой.

хотя это возможно, это может измениться; replaceState в настоящее время использует объект, переданный как состояние, т. е. replaceState(x), и как только он установлен this.state === x. Это немного легче, чем setState, поэтому его можно использовать в качестве оптимизации, если тысячи компонентов часто устанавливают свои состояния.
я утверждал это с этот тест.


если ваше текущее состояние {a: 1}, а вы называете this.setState({b: 2}); когда применяется состояние, оно будет {a: 1, b: 2}. Если вы позвонили this.replaceState({b: 2}) ваше состояние будет {b: 2}.

боковое Примечание: состояние не устанавливается мгновенно, поэтому не делайте this.setState({b: 1}); console.log(this.state) при тестировании.


определение пример:

// let's say that this.state is {foo: 42}

this.setState({bar: 117})

// this.state is now {foo: 42, bar: 117}

this.setState({foo: 43})

// this.state is now {foo: 43, bar: 117}

this.replaceState({baz: "hello"})

// this.state. is now {baz: "hello"}

обратите внимание на это из docs, но:

setState () не сразу мутирует это.государство, но создает в ожидании перехода государства. Доступ к этому.состояние после вызова этого метод может возвращать текущее значение.

же replaceState()


по словам docs, replaceState может устареть:

этот метод недоступен для компонентов класса ES6, которые расширяют React.Деталь. Он может быть полностью удален в будущей версии React.