Взаимодействие массивов во Vue JS
Возникла проблема с Vue JS - в data объявлены 2 пустых массива. Вначале работы я заполняю массив A сотней вложенных массивов. Позже, при действия пользователя (клик по отрисованному элементу), мне нужно взять из массива А элемент, соответствующий кликнутому блоку и "развернуть" для пользователя, чтобы он мог редактировать все его поля. Для этого я беру пустой массив Б и присваиваю ему целевой элемент массива А. А потом через v-for отрисовываю input-ы с v-model из содержимого массива Б.
Проблема в следующем - после того как я приравнял массив Б к элементу массива А, они становятся будто связаны и любое изменение элемента массива Б влечет идентичное изменение во вложенном массиве А.
Не могу найти решения, куда смотреть? Нужно чтобы массив Б был просто копией элемента массива А и жил своей жизнью.
Пример
var app = new Vue({
el: '#app',
data: {
array_1:[['22','43','12'],['tg','gf','fc'],['ффф','иии','ппп']],
array_2:[]
},
methods: {
start_edit(arr){
app.array_2=arr;
}
}
});
при клике вызывается метод start_edit() c кликнутым элементом в качестве аргумента. Предположим что это было так:
start_edit( array_1[2])
потом я меняю что-либо в array_2 и оно так же сразу меняется в array_1[2];
Как этого избежать?