ReactJS componentWillMount无限循环问题求助（Salesforce环境）

你的问题核心在于同步的while循环和异步的Promise回调之间的执行顺序冲突：while是同步执行的，会在瞬间反复循环，而contentPromise.then()里的回调是异步执行的——等你在回调里修改queryMore或者offSet的时候，while已经跑了无数次了，根本不会停下来。

修复方案：用Async/Await处理异步逻辑 #

把你的componentWillMount改成异步函数，用await等待每次查询完成，这样循环会按预期等待异步操作结束后再执行下一次，避免无限循环。另外注意：React官方已经不推荐使用componentWillMount，建议换成componentDidMount，这里先按你的原有生命周期修改，你可以后续迁移。

修改后的代码如下：

async componentWillMount(){ 
  let queryMore = true 
  let offSet = 0 
  let contents = [] 
  while(queryMore) { 
    makeDeferredProvider() 
    let contentObject = SObjectModel.deferredObject('Content') 
    let retrieveOptions = { 
      limit: 10, 
      where: { Type__c: { eq: 'Image' } } 
    } 
    if(offSet > 0) {
      retrieveOptions.offset = offSet 
    }
    try {
      const records = await contentObject.retrieve(retrieveOptions)
      records.forEach( record => { 
        let item = { 
          'name': record.get('Name'), 
          'id': record.get('Id') 
        } 
        contents.push(item) 
      })
      // 判断是否还有更多数据：如果返回的记录数等于limit，说明还有，否则终止循环
      queryMore = records.length === 10
      if(queryMore) {
        offSet += 10
      }
    } catch(error) {
      console.log(error)
      queryMore = false // 出错时终止循环
    }
  } 
  this.setState({ contents: contents }) 
}

关键修改点说明： #

• 将componentWillMount声明为async函数，这样可以在内部使用await
• 用await替代then()回调，让每次查询完成后再继续循环，确保queryMore和offSet的修改能被循环感知
• 优化了offSet的赋值逻辑，用更清晰的if判断替代三元表达式
• 添加try/catch捕获查询错误，避免出错时循环卡死
• 修正了records.length = 10的错误（你原来写的是赋值=，应该是判断相等===）

内容的提问来源于stack exchange，提问作者elchiconube