My goal is to duplicate an array within a Pinia store so that I can use it to create a reactive object in various components for input modeling. The intention is to only update the original array if the user decides to save any changes made using the copy array.
The issue is that whenever I modify the copy array, the original array also gets instantly modified as if they are referencing each other.
import { defineStore } from 'pinia'
export const useItemStore = defineStore('item', {
state: () => ({
items: ['foo', 'bar'],
itemView: []
}),
actions: {
initialize(){
this.itemView = [...this.items] //create a copy of the original items array
},
edit(newItems){
this.itemView = newItems
},
save(){
this.items= [...this.itemView ] //save the changes
},
})
I am seeking a solution to create a independent copy of a Pinia array that can be edited without affecting the original one.
In my specific scenario, items consists of deeply nested Objects, which prevents me from simply using an array map function to copy each item's value.