подписка pusher с React-native, обновление setState

Я пытаюсь реализовать функцию с помощью Pusher-JS в приложении React-native, но мне трудно соответствующим образом обновить состояние переменной в этом приложении.

Вне основного класса я определяю

var pusher = new Pusher('xxxxxxxsome number and code');

Внутри компонента основного класса я определяю функцию

test() {
    var channel = pusher.subscribe('test_channel');
    console.log('ddddddd');
    channel.bind('my_event', function(data) {

    if (data != null) {
      if (data.message != null){
        console.log(data.message);
        this.setState({
          message_box: data.message
          });
      }
    }  
    }.bind(this));
  }

и я помещаю test() в функцию render(), как показано ниже.

render() {
    this.what();
    ...

Приложение зависает, когда я отправляю текстовое сообщение (с сервера тестирования pusher) на «test_channel» (в мобильном приложении). Когда я вижу журнал в консоли Chrome, console.log('dddddd') и console.log(data.message) продолжают очень быстро прокручиваться вниз (похоже, что test() часто перерисовывается).

Я попытался взять test() вне render(), но я не знаю, как отдельно поместить и обновить переменную состояния вне основного компонента.

Есть ли способ стабилизировать эту функцию или установить состояние вне основного компонента (этого)?

Пожалуйста, поделитесь со мной любой идеей!

Лучший


react-native javascript pusher
person Sungpah Lee    schedule 10.08.2016    source источник

Ответы (1)


arrow_upward
1
arrow_downward

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

Возможно, попробуйте привязаться к событию один раз, возможно, в getInitialState?

person Jamie Patel    schedule 10.08.2016
comment
вау это работает. Итак, если я правильно понял вашу точку зрения, когда функция указана в getInitialSate (или в конструкторе в моем случае), она инициализируется один раз, и всякий раз, когда добавляется новый обратный вызов, запускается тестовая функция => setState активируется только один раз => повторите рендеринг, и этот рендеринг не повлияет на тестовую функцию, поскольку он изолирован, верно? (: Спасибо за вашу помощь!! - person Sungpah Lee; 11.08.2016