没有传递给组件的道具反应原生答案

【问题标题】：props not passing to component react native没有传递给组件的道具反应原生
【发布时间】：2021-08-14 05:26:57
【问题描述】：

我们有一个组件，通知单元格，如果您单击通知单元格，它会打开一个包含帖子详细信息的屏幕。但是，通知单元格没有将道具传递到帖子详细信息屏幕。

通知单元：

showThoughtsPage = async() => {
  await firebase.firestore()
    .collection('thoughts')
    .doc(this.state.postID)
    .get()
    .then((doc) => {
      if (doc.exists) {
        console.log(doc.data().username) //<--- works

        this.state.navigation.push('ThoughtsDetails',
        {
          Tusername: doc.data().username,
          Tdescription: doc.data().description,
          Timage: doc.data().image,
          Tdate_created: doc.data().date_created,
          TlikesCount: doc.data().likesCount,
          TcommentsCount: doc.data().commentsCount,
          TviewsCount: doc.data().viewsCount,
          Tcategory: doc.data().category,
          TpostID: doc.data().postID,
          Tuid: doc.data().uid,
          Tlink: doc.data().link,
          TmediaType: doc.data().mediaType,
        })
      }
    });
}

帖子详情屏幕：

constructor(props) {
 super(props);
 this.state = {
   username: this.props.Tusername,
   image: this.props.Timage,
   description: this.props.Tdescription,
   postID: this.props.TpostID,
   link: this.props.Tlink,
   navigation: this.props.navigation,
   date_created: this.props.Tdate_created,
   viewsCount: this.props.TviewsCount,
   isLoading: true,
   currentUser: firebase.auth().currentUser.uid,
   posterUID: this.props.Tuid,
   mediaType: this.props.TmediaType,
   modalOpen: false,
   commentsArray: [],
   currentViewsCount: 0,
};
console.log(this.props.Tusername + " username") // <--- undefined

}

知道我们在哪里犯了错误吗？

【问题讨论】：

你需要使用this.setState来更新一个状态，你不能通过覆盖属性来更新它
@Sysix 这在哪里特别重要？我正在使用 this.state 在帖子详细信息中初始化构造函数中的状态，而不是在通知单元格中使用状态
当来自showThoughtsPage 的异步请求完成时，您正在更新状态，来自父组件的状态也不需要在子组件中重新初始化。当 prop 更新时，组件也会这样做
@Sysix 可能我错过了一些东西。我在 showThoughtsPage 的哪个位置更新状态？我从firebase中提取信息并将其直接传递到想法页面，我访问状态的唯一时间是当我调用导航时，你是说当我调用导航时我需要setState？如果是这种情况，您能否提供一个示例作为您的意思的答案，因为我并没有真正关注

标签： javascript react-native

【解决方案1】：

想通了 - 我需要像这样访问帖子详细信息中的道具：

  username: this.props.route.params.Tusername,
  image: this.props.route.params.Timage,
  description: this.props.route.params.Tdescription,
  postID: this.props.route.params.TpostID,
  link: this.props.route.params.Tlink,
  navigation: this.props.route.params.navigation,
  date_created: this.props.route.params.Tdate_created,
  viewsCount: this.props.route.params.TviewsCount,
  isLoading: true,
  currentUser: firebase.auth().currentUser.uid,
  posterUID: this.props.route.params.Tuid,
  mediaType: this.props.route.params.TmediaType,
  modalOpen: false,
  commentsArray: [],
  currentViewsCount: 0,

【讨论】：