反应原生返回 null 状态

Posted 2023-02-23

【中文标题】反应原生返回 null 状态

【英文标题】：React native returning null for state

【发布时间】：2017-10-25 21:58:09

【问题描述】：

我正在尝试设置项目的状态，然后将新状态用作传递给我的组件的道具，但它似乎没有及时设置状态

constructor (props) 
    super(props)
    this.cartFirebase = firebaseApp.database().ref('carts')
    this.cartFirebase.child(DeviceInfo.getUniqueID() + '/items').push(
      item: this.props.data.name,
      qty: 1
    ).then((snap) => 
      this.state = 
        cartKey: snap.key
      
    )
  

组件

<AddToCartRow item=this.props.data.sizes option='size' key=this.state.cartKey/>

【参考方案1】：

这是因为在渲染AddToCartRow 时，this.state.cartKey 是null。

您正在从尚未实现的 Promise .then(..) 中设置 cartKey。

您的render() 实际上是在您的constructor 填充this.state.cartKey 之前调用的。

您可以编写以下逻辑以仅在 this.state.cartKey 评估为 true 并且我们知道 null 评估为 false 时渲染组件。

this.state.cartKey && <AddToCartRow item=this.props.data.sizes option='size' key=this.state.cartKey/>