1

Компонент А получат с сервера сообщение и записывает его в newMessage . компонент В следит за newMessage и при обновлении вставляет его в массив и рендерит. Но если сообщения приходят быстро, то newMessage перезаписывается до того как обновится страница.

Пример:

for (let i = 0; i < 5; ++i) {//предположим что это сервер присылает сообщения
     this.setState({
          newMessage:i
         });
}

Ожидаемый результат: 0 1 2 3 4.

На самом деле: 4.

Можно их как то поставить в очередь(средствами react)???

UPDATE

COMPONENT A

//msg {id:'...', content:'...', date:'...', ...}
    reciveMessage(msg){//<-- сюда сервер присылает сообщение.

       this.setState({
                  newMessage:msg
                 });
    }

COMPONENT B

//Компонент должен увидеть что **newMessage** изменилось и добавить его в  список. 
    componentWillReceiveProps(nextProps) {
    let list = this.state.MyMessagesList.slice();
    list.push(nextProps.newMessage);

    this.setState({
           MyMessagesList:list
           });
    }
1
  • к сожалению для поставленной задачи невозможно использовать state или props. Пока кроме setInterval в голову ничего не приходит. Я возьму время подумать:) 28 мар 2018 в 8:51

1 ответ 1

2

Судя по коду, вы каждый раз перезаписываете newMessage, чтобы получилась такая строка, нужно делать конкатенацию строк:

this.setState({ newMessage: this.state.newMessage + ' ' + i })

UPD: Извиняюсь, неверно написал, судя по документации:

setState() does not immediately mutate this.state but creates a pending state transition. Accessing this.state after calling this method can potentially return the existing value. There is no guarantee of synchronous operation of calls to setState and calls may be batched for performance gains.

Нельзя вызывать setState в цикле. Если они вызываются один за другим, то они группируются.

9
  • нет, это не строка. Это независимые сообщения(сложный объект присланный сервером). Я упростил для примера.
    – user282446
    27 мар 2018 в 14:59
  • @user282446 у вас запросы как к серверу идут? 27 мар 2018 в 15:05
  • Нет, сервер присылает.
    – user282446
    27 мар 2018 в 15:07
  • @user282446 на сервер запросы асинхронно идут? 27 мар 2018 в 15:08
  • Сервер присылает сообщение через signalR в метод в компоненте А. Когда и в каком количестве они приходят не известно. Цикл в примере я сделал просто что бы показать проблему (можно представить что это сервер который присылает сообщения, а все что внутри цикла - это метод который их принимает )
    – user282446
    27 мар 2018 в 15:13

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.