He estado tratando de agregar un objeto dentro de un objeto, pero este desaparece después de llamar a una función:

Tengo un objeto 'elemento'

 const item = { id, type: 'instance', parent_id: null, }

Luego llamo a una API para obtener otro objeto de datos.

 try { const res = await api.getData() console.log(res.data) // return { key1: value1, key2: value2 } } catch(error) { console.log(error) }

Agrego ese par clave/valor a un objeto 'instance_setting' dentro del elemento.

 item.instance_setting = res.data console.log(item) // return { id: 'xxx', type: 'instance', 'parent_id': 'xxx', instance_setting: {key1: value1, key2: value2 }}

Hasta ahora todo va bien.

Luego llamo a una función 'MUTATE_DATA' para agregar este objeto a mi estado, lo que desencadena el comportamiento inesperado. Aquí está el código completo:

 const MUTATE_DATA = (item) => { state.menuItems.push(item) state.newItems.push({ id: item.id }) } const useAddInstance = async (id) => { const item = { id, type: 'instance', parent_id: null, } try { const res = await api.getData() item.instance_setting = res.data MUTATE_DATA(item) console.log(item) // return { id: 'xxx', type: 'instance', 'parent_id': 'xxx'} } catch(error) { console.log(error) }

Puede ver en el archivo console.log(item) mi objeto instance_setting desapareció.

Sé que el problema de hacer líneas es

 state.newItems.push({ id: item.id })

pero no entiendo por qué esto haría desaparecer este objeto anidado.

¡Gracias por tu ayuda!