Javascript 如何从两个现有对象正确创建对象

我从一个api收集了两个不同的对象，我想在将它们传递给子组件之前将它们组合成一个单独的对象

我尝试将其中一个循环，以将第三个循环创建到ComponentDidUpdate中（可能不是正确的方法），这会弹出一个错误：“超过最大更新深度。当组件在componentWillUpdate或ComponentDidUpdate中重复调用setState时，可能会发生这种情况。React限制嵌套更新的数量，以防止无限循环。”

导出默认类路由器扩展组件{
状态={
员额：[]，
秘书：[]，
邮政秘书：[]，
}
组件willmount（）{
this.obtenerPublicaciones（）；//调用api
this.obtenerSecciones（）；//调用api
}
componentDidUpdate（prevProps、prevState）{
this.createPostSeccionArray（）；
}
createPostSeccionArray（）{
const posts=[…this.state.posts]；
const secciones=[…this.state.secciones]；
//检查是否已提取两个对象（有时未完成其中一个对象的提取）
if（posts.length！==0&&secciones.length！==0）{
让postSeccionArray=[]；
posts.forEach（元素=>{
const postSeccionElement={}；
const actualPost=元素；
const actualsecion=secciones.find（el=>el.id==actualPost.id）；
postSeccionElement.post=实际成本；
postSeccionElement.seccion=实际事件；
postSeccionArray=[…postSeccionArray，postSeccionElement]；
});
这是我的国家({
postSeccion:postSeccionArray，
})
}
}
}

这是我期望的对象的输出数组：

[{
  "post": {
    "id": 1,
    "titulo": "Publicación 1",
    "cuerpo": "<p>test <b>asdasd</b></p>",
    "seccion": 1,
    "fecha_creacion": "2019-04-16T15:16:36.181618Z",
    "fecha_edicion": "2019-04-16T15:16:36.181651Z",
    "autor": 1
  },
  "seccion": {
    "id": 1,
    "nombre": "Deportes",
    "descripcion": "test"
  }
}]

[{
“职务”：{
“id”：1，
“提图洛”：“公共1号”，
“cuerpo”：“测试asdasd
”，
“秘书”：1，
“费夏奥公司”：“2019-04-16T15:16:36.181618Z”，
《费查法令》：“2019-04-16T15:16:36.181651Z”，
“自动”：1
},
“秘书”：{
“id”：1，
“名义”：“驱逐出境”，
“描述”：“测试”
}
}]

要合并2个或更多对象，可以使用“扩展”操作符

const a={
建议1：“价值1”，
prop2:23455，
prop3：“你好”
}
常数b={
prop2:67899，
建议4：“工作”
}
常数c={…a，…b}
console.log（c）

首先，您可以使用map函数重构createPostSeccionArray方法：

export default class Router extends Component {
  state = {
    posts: [],
    secciones: [],
    postSeccion: []
  }

  componentWillMount() {
    Promise.all(this.obtenerPublicaciones(), this.obtenerSecciones()).then(_ =>
      this.createPostSeccionArray()
    )
  }

  createPostSeccionArray() {
    const posts = [...this.state.posts]
    const secciones = [...this.state.secciones]

    // check if the two objects were fetched (sometimes didn't finish fetching one of them)
    if (posts.length !== 0 && secciones.length !== 0) {
      const postSeccionArray = posts.map(element => {
        const actualSeccion = secciones.find(el => el.id == element.id)
        return {
          post: element,
          seccion: actualSeccion
        }
      })

      this.setState({
        postSeccion: postSeccionArray
      })
    }
  }
}

---

我猜您只想在安装组件时创建post section数组。那么你能像我建议的那样使用promise来调用createPostSeccionArray一次吗？

基于你现在所拥有的，下面将解决它

  componentDidUpdate(prevProps, prevState) {
    if(!prevState.postSeccion.length > 0){
      this.createPostSeccionArray();
    }
  }

---

但是，我会等待你方的进一步澄清，然后我会编辑此答案。

你当前的输出是什么？你需要在设置状态之前添加条件，否则它将以无限循环结束。我很困惑，为什么

posts

和

secciones

的初始状态被初始化为数组，而您说它们是对象？（我知道数组是js中的对象，但是你理解我的查询。你可以单独指定

posts

和

secciones

的外观吗？@jibinzoseph它们看起来就像在第三个对象中一样。这仍然会在有限循环中结束，因为你调用setState时没有任何条件，你需要结束某种条件PDATE状态，而不是没有任何检查更新我们不调用组件Debug更新，所以没有无限循环读取这考虑了投票/接受的解决方案为您工作：