In react native application i am using react navigation. I am send a object from one screen to other. After one section i am running a function which makes copy of my route parameter and modifying the copy. But my original parameter is also modifying. I do not want to modify the original object. How to avoid mutating parameters ?
Here is my parameter structure
{
id: 1
name: 'some name',
productOptions: [
{
productOptionId: 1
productOptionName: 'Option name'
options: [
{
name: 'some option name',
value: 12
},
{
name: 'some option name',
value: 12
},
{
name: 'some option name',
value: 12
}
]
},
{
productOptionId: 1
productOptionName: 'Option name'
options: [
{
name: 'some option name',
value: 12
},
{
name: 'some option name',
value: 12
},
{
name: 'some option name',
value: 12
}
]
}
]
}Here is my screen code
const MyScreen({navigation, route}){
const product = route.params.product
const productOptions = route.params.productOptions
const [newOptionState, setNewOptionState] = useState([])
useEffect(() => {
setTimeout(()=>setPreSelected(), 1000)
}, [])
const setPreSelected = ()=>{
let tempProductOptions = [...productOptions]
tempProductOptions.map((item)=>{
if(item.options.length && item.options.length>1){
item.options.splice(1)
}
})
setNewOptionState(tempProductOptions)
}
}