I'm trying to add new items to an array of an object that resides in another object of a state. Pretty nested.
So I tried the following way...
// The initial data
[options, setOptions] = useState({
name: 'Name goes here'
type: 'type goes here'
series : [{
type: 'series type',
label: 'series label'
})
Now I want to add another object inside the object of series array with useEffect(). And I tried:
useEffect(() => {
// other functionalities goes here
setOptions({
...options, // for copying previous data outside of series
series: [{
...options.series, //this is for copying previous data of series
tooltip: {
enable: true,
}]
})
}, [refreshData])
The way I'm copying ...options
works absolutely fine, But when I try to copy ...options.series
it adds a new copied object inside the object of series array like the following:
{
name: 'Name goes here' //fine
type: 'type goes here' //fine
series: [{
{type: 'series type', label: 'series label'}, //not fine
tooltip: {enable: true} //not fine
//what I want is: to have previous object data and tooltip appended as another item
}]
}
The way I want the object to be is:
{
name: 'Name goes here' //fine
type: 'type goes here' //fine
series: [{
type: 'series type',
label: 'series label'
tooltip: {enable: true}
}]
}
Can Anybody help me regarding this. I would appreciate any help.. Thanks
CodePudding user response:
here is sample of what you are trying to achieve .
const d = {
name: 'Name goes here',
type: 'type goes here',
series : [{
type: 'series type',
label: 'series label'
}]
}
const newD = {
...d,
series: [
{
...d.series[0], // problem is here
tooltip: {
enable: true,
}
}
]
}
console.log (newD)