ReactNativeJS：警告：setState（...）：在现有状态转换期间无法更新（例如在`render`中）答案

【问题标题】：ReactNativeJS: Warning: setState(...): Cannot update during an existing state transition (such as within `render`)ReactNativeJS：警告：setState（...）：在现有状态转换期间无法更新（例如在`render`中）
【发布时间】：2017-02-22 08:31:51
【问题描述】：

我正在开发一个 React-Native\Redux 应用程序

我在渲染时预填充 a 。这很好。 2.填充后我想调用一个调度操作，以便每个的值用于执行一些计算并稍后存储：我知道它不可能在渲染期间更新状态，但是有没有我可以做到这一点?

我需要它在生成输入字段时更新状态。

我们将不胜感激。

谢谢

handleInputChange: function(product, productId, input){
let { currentSale, updateProductQuantity } = this.props;
let updatedCurrentSale = TransactionsService.updateProductQuantity(currentSale, product, productId, input);
let transaction = TransactionsService.packageTransaction(updatedCurrentSale);

updateProductQuantity(updatedCurrentSale, transaction)
 },

updateProductQuantity 调用调度操作，这就是我们遇到问题的地方

handleQuantityValue: function(product, productId){
 let { orderSelected } = this.props;

  if(orderSelected){
     var index = orderSelected.products.findIndex(x => x.product_id==productId)
  }

  var i = index

  if( i >= 0){
      var qtty = orderSelected.products[i].product_quantity
      this.handleInputChange(product, productId, qtty).bind(this)
      return qtty.toString()
  }
  else{
        return ''
  }
},

返回数量值

renderProducts: function(){
  let { currentUser, currentSale, orderSelected } = this.props;
  return _.map(currentSale.productSales, function(product, productId){
  var qtty = this.handleQuantityValue(product, productId)
  return <View style={Styles.questionPanel}>
    <Question 
      product={product}
      productId= {productId}
      Order={ orderSelected }
      quantity= { qtty }
      onInputChange={this.handleInputChange}
    />
  </View>
}.bind(this));

这会呈现产品，TextInput 会填充 quantity 值。另一个是当它呈现时，我应该（不一定）调度一个动作

render: function(){
 let { currentSale } = this.props;
 return (
  <View style={{flex: 1}}>
    <NavBar navigator={this.props.navigator} />
    <ScrollView>
      <Text style={[Styles.dayDisplayHeader, Styles.spacing]}>
        Enter Your Sale:
      </Text>
      {this.renderProducts()}
      <Calculator 
        productSales={currentSale.productSales}
        totalSales={currentSale.totalSales}
      />
      <Button text={'Save'} whenTapped={this.handleSubmit} />
    </ScrollView>
  </View>
)

【问题讨论】：

听起来你试图从错误的角度解决问题。您可以粘贴您的组件的代码吗？
我已经编辑了我的问题

标签： javascript reactjs react-native react-redux react-native-android

【解决方案1】：

你有一个递归。计算一个数量值会触发handleInputChange，这反过来又会在重新渲染组件时触发数量计算。

我认为您在计算数量值时甚至不需要手动触发handleInputChange。你不应该。

流程应该是这样的：

通过 props 传递数据。
渲染时根据道具计算数量。
handleInputChange 仅当用户更改值时。
一旦 redux 存储更新（我假设它通过 updateProductQuantity 发生），新值将通过 props 再次传递给组件（返回步骤 1）。

【讨论】：

这就是我目前正在做的事情，现在想要务实地完成它。假设当销售由送货员交付时，他只需要确认销售，但还可以在需要时将更多产品添加到列表中。我现在会坚持这些。谢谢。

【解决方案2】：

您可以尝试在 componentDidUpdate 方法中设置状态（您可以这样做）：您只需要小心并检测在哪种情况下您必须调用 setState 以避免无限递归。

setState inside componentDidUpdate

【讨论】：

正如我所说，您必须明智并检查 componentDidUpdate 何时更新状态，何时不更新！理想情况下应该只做一次
我不明白你的问题。