Рекомендовать асинхронное обновление - PullRequest
0 голосов
/ 06 июня 2018

Как переставить компонент с перекомпоновкой, когда проп изменен из-за пределов компонента вида?

const Message = ({msg}) => <div>The prop has a value of <b>{msg}</b>.</div>

const App = Recompose.withProps(() => {
  let msg = 'One'

  // this async update doesn't work because nothing triggers a rerender
  setTimeout(() => {msg = 'Two'}, 500)

  return {msg}
})(Message)


ReactDOM.render(<App/>, document.getElementById('app'))

Когда этот компонент визуализируется, он показывает значение как Один , но неизменить на Два через 500 мс, даже если он меняет реквизит.

setTimeout здесь упрощает случай, когда в фактическом сценарии использования я подписываюсь на сервер веб-сокетов и когда сообщение отправляется,Компонент сообщения обновляется.

1 Ответ

0 голосов
/ 06 июня 2018

Отказ от ответственности: я еще не работал с перекомпоновкой активно.

Но я знаю, что ваш компонент должен быть с состоянием.Я нашел withState в перекомпонованных документах

const enhance = withState('counter', 'setCounter', 0)
const Counter = enhance(({ counter, setCounter }) =>
  <div>
    Count: {counter}
    <button onClick={() => setCounter(n => n + 1)}>Increment</button>
    <button onClick={() => setCounter(n => n - 1)}>Decrement</button>
  </div>
)

Так что я думаю, вам нужно определить состояние msg с помощью withState, а затем вы можете передать setMsg в ваш компонент.при вызове этого setMsg в вашем setTimeout должно быть выполнено обновление.

const withMsg = withState('msg', 'setMessage', '');
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...