Блог

У любого ветерана vuejs это происходит на VueJS(v2), где у вас есть 2 массива на компоненте, и вы передаете значение в 1-й массив, а 2-й массив также получает значение, НЕ ПРИКАСАЯСЬ К НЕМУ.

Это первый раз, когда я сталкиваюсь с этим, к вашему сведению, я использую VueJS уже более 2 лет.

Дополнительная информация У меня есть ОЧЕНЬ похожий компонент с точно таким же data variables , и этого не происходит, только на 2-м компоненте.

 array1 = [];
array2 = [];

array1.push('gether');
 

результат должен быть

 array1 = ['gether'];
array2 = [];
 

ЧТО НА САМОМ ДЕЛЕ ПРОИСХОДИТ

 array1 = ['gether'];
array2 = ['gether'];
 

Я также играл с отладчиком Google DevTools Vue.

Добавление записи в поле array1 «ТОЛЬКО» также добавляет значение в поле array2 .

немного умопомрачительно

Поскольку массивы в JS являются ссылочными значениями, поэтому при попытке скопировать его с помощью = он будет копировать только ссылку на исходный массив, а не значение массива. Чтобы создать реальную копию массива, вам нужно скопировать значение массива в новую переменную значения. Таким образом, этот новый массив не ссылается на старый адрес массива в памяти.

Для этого вы можете использовать array.slice() метод, так как он создает новый массив, а не просто ссылку !

Смотрите Пример и разбирайтесь в различиях =>

Использование ссылки (=)

 let array = ["some text"]

// Making it equal to main array  and using reference to copy 
array1 = array;
array2 = array;

array1.push('gether');
console.log(array2)
 

Использование array.slice() для клонирования

 let array = ["some text"]

// Making it equal to main array and using slice to copy 
array1 = array.slice(); 
array2 = array.slice();

array1.push('gether');

console.log(array2)
 

Когда вы делаете два массива равными одному и тому же значению, вы делаете их равными по ссылке. Так

 foo = ['a', 'b', 'z']

array1 = foo;
array2 = foo;

array1.push('d');

console.log(array2) //Outputs: ['a', 'b', 'c', 'd']
 

Это ожидаемое поведение.

Однако это не то же самое, что в приведенном примере в вашем вопросе. Запустите фрагмент ниже, чтобы увидеть разницу.

Чтобы избежать этого, вы можете использовать slice() для создания копии исходного массива. Я добавил пример к фрагменту кода.

 let foo = ["a", "b"];

let array1 = foo;
let array2 = foo;

array2.push("c");

console.log(foo); // Outputs ["a", "b", "c"]
console.log(array1); // Outputs ["a", "b", "c"]

let array3 = [];
let array4 = [];

array4.push("a");

console.log(array3); // Outputs []
console.log(array4); // Outputs ["a"]

let bar = ["a", "b"];

let array5 = bar.slice();

bar.push("c");

console.log(bar); // Outputs ["a", "b", "c"]
console.log(array5); // Outputs ["a", "b"]