goBack（）之后不调用componentWillReceiveProps（）

Question

大家好，所以我必须先屏幕是聊天室，第二是聊天。

在第一个我有聊天频道，我选择一个，然后我要去第二个屏幕，我实际上在聊天。在第二个屏幕中，我使用componentWillReceiveProps进行graphql订阅。一切正常，直到我使用this.props.navigation.goBack()，如果我返回消息被发送但componentWillReceiveProps永远不会再被调用。

componentWillReceiveProps(nextProps) {
    console.log('I am here')
    if (nextProps.data !== undefined && !nextProps.data.loading) {
      let { subscribeToMore } = this.props.data;
      subscribeToMore({
        document: MESSAGE_ADDED_SUBSCRIPTION,
        updateQuery: (previousResult, { subscriptionData }) => {
          if (!subscriptionData.data) {
            return previousResult;
          }

          const newMessage = subscriptionData.data.messageAdded;

          if (
            previousResult.getMessagesForThisChannel[0] === undefined ||
            previousResult.getMessagesForThisChannel[0].channel._id ===
              newMessage.channel._id
          ) {
            if (
              !previousResult.getMessagesForThisChannel.find(
                n => n._id === newMessage._id
              )
            ) {
              return {
                ...previousResult,
                getMessagesForThisChannel: [
                  { ...newMessage },
                  ...previousResult.getMessagesForThisChannel
                ]
              };
            }
          }

          return previousResult;
        },
        onError: err => console.log(err)
      });
    }
}

Answer 1

无论出于何种原因，this.props.navigation.goBack()默认情况下不会触发你的redux状态的任何变化，这就是你的道具没有刷新的原因。你可以做的是在你的函数旁边触发一些额外的逻辑（一个动作），调用this.props.navigation.goBack()来通知redux已经发生了变化。如果你真的没有任何数据变化，只需简单地创建任何reducers的克隆（使用map，spread等）并返回它。这应该刷新你的道具。

Answer 2

一种方法是使用react-navigation willFocus事件，您可以在componentWillMount方法中附加组件内的事件：

componentWillMount()
  this.props.navigation.addListener(
    'willFocus', () => {
      // do what ever you'd like here...
    }
  );
}

然后，当您的组件再次聚焦在屏幕上时，它的行为与您对componentWillReceiveProps的预期相同。