Взаимодействие массивов во 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];

Как этого избежать?


Ответы (0 шт):