Meteor-React: Как выполнить повторную визуализацию в состоянии внутри setState после завершения обратного вызова Meteor.call?

Question

Краткое описание события:
Я нажимаю кнопку редактирования.
editForm () отображает форму, используя this.setState() и this.state внутри render ().
У setState () выше есть {this.state} как значение, которое мне нужно отобразить.
Как только я нажимаю кнопку обновления внутри формы, активируется updateMessage (), который Meteor.call включает опцию обратного вызова.
Эта функция обратного вызова имеет this.setState(), который подключается к тому, что я упомянул выше.

Итак, как мне сделать это {this.state} отображать после обратного вызова Meteor.call () и setState ()?

-note- помещение этого {this.state} в render () будет отображаться после обратного вызова.

Вот код: this.state.show_error_or_noerror внутри editMessage() - это то, что мне нужно отобразить.

constructor(props) {
super(props);

    const messageContent = this.props.messageContent;
    const username = this.props.username;
    const articleTitle = this.props.articleTitle;

    this.state = {
      show_error_or_noerror: '',
      messageContent: messageContent,
      username: username,
      articleTitle: articleTitle
    };

    this.editMessage = this.editMessage.bind(this);
    this.updateMessage = this.updateMessage.bind(this);

  }
  updateMessage(event) {
    event.preventDefault();

    const messageId = this.props.messageId;
    const messageContent = this.refMessage.value.trim();

    Meteor.call('message.update', messageId, messageContent, (error) => {
      if(error) {
        this.setState({show_error_or_noerror: error.reason});
      } else {
        this.setState({show_error_or_noerror: 'Updated successfully.'});
      }
    });
  }
  editMessage(event) {
    event.preventDefault();

    const messageId = this.props.messageId;

    this.setState({
      ['show_form'+messageId]: <form onSubmit={this.updateMessage}>
        <textarea
          ref={(textarea) => {this.refMessage = textarea;}}
          defaultValue={this.state.messageContent}
        />
        <h6>by {this.state.username}</h6>
        <h6>Article: {this.state.articleTitle}</h6>
        <button type="submit">Update</button>
        <button onClick={this.hideForm}>Hide</button>
        {this.state.show_error_or_noerror}
      </form>
    });
  }
  render() {
    const messageId = this.props.messageId;

    return (
      <span className="message_updator">
        <button onClick={this.editMessage}>Edit</button>
        {this.state['show_form'+messageId]}
      </span>
    )
  }
}

Answer 1

Чтобы добиться реактивности в метеоре, создайте объект Tracker.dependency, и ваш рендер будет зависеть от него ( ссылка).

Создайте зависимость в своем конструкторе

var dep = new Tracker.Dependency;

И ваш рендер зависит от этого

dep.depend();

И вызвать это в вашей функции setState

dep.changed();