如何制作屏幕动态标题

Question

我有2个屏幕列表生产和细节生产。当我从列表导航到详细信息时，我会获取有关该产品的所有信息。因此，我想在屏幕标题上显示产品名称。 我做了这个方法

详细信息js：

componentWillReceiveProps(nextProps){
   if(nextProps.product.name !== undefined)
       this.props.navigation.setParams({ Name:  nextProps.product.name })
}

navigator.js：

detailProduct: {
  screen: detailProduct,
  navigationOptions: ({ navigation }) => 
   ({title:navigation.getParam('Name', 'DefaultName'),})
}

但是我得到了这个错误：[违反不变的：超过最大更新深度。当组件在componentwillupdate或componentDidupdate中重复调用setState时，这可能会发生。反应限制了嵌套更新的数量，以防止无限循环。]知道我使用redux。请求如何解决这个问题，如何使Header的标题动态。谢谢

Answer 1

似乎您需要将条件从 if(nextProps.product.name !== undefined)更改为 if(nextProps.product.name !== undefined && nextProps.product.name !== this.props.navigation.getParam('Name'))。

否则，您每次都会更改状态。

工作演示