Почему данные в списке 1 изменяются автоматически, когда я изменяю данные в другом списке 2, который клонирован из списка 1? Использование Vue.Draggable - PullRequest
Новая
       42

Почему данные в списке 1 изменяются автоматически, когда я изменяю данные в другом списке 2, который клонирован из списка 1? Использование Vue.Draggable

0 голосов
/ 07 ноября 2019

Я использую Vue.Draggable в своем проекте Vue и пытаюсь перетащить (клонировать) кнопку из sider в перетаскиваемый компонент.

Я хочу изменить данные при клонировании кнопки в компонент. Но я обнаружил, что когда я изменяю данные в списке, который связан с компонентом, исходный список, который использовал sider, изменяется автоматически.

Есть ли какой-то механизм синхронизации в Vue.Draggable или что-то? Я хочу изменить данные объекта только в компоненте.

Я попытался изменить объект в списке 2 вручную, используя расширение vue в браузере Chrome. И это все еще происходит. Поэтому я думаю, что, возможно, это не ошибка в моем коде. 

addEntity (conditionID, entity) {
                if (!entity.forChoose) {

                }
                else {
                    let variable = 0;
                    for (let i = 0, len = this.whens.length; i < len; i++) {
                        if (this.whens[i].entity[0].id == entity.id) {
                            variable++;
                        }
                    }
                    this.whens[conditionID].entity[0].forChoose = false;
                    this.whens[conditionID].entity[0].variable = variable;
                    this.whens[conditionID].entity[0].name = entity.name + '-fake';
                }
            },

Приведенный выше код - это событие, когда я перетаскиваю данные в компонент и изменяю некоторую переменную.

Хотя я ничего не делалк исходным данным в Sider, откуда я клонировал данные, они также изменились.

Есть ли способ изменить перетаскиваемые данные, но не повлиять на исходные данные? Пожалуйста, помогите мне, спасибо!

1 Ответ

0 голосов
/ 07 ноября 2019

Я думаю, что это происходит из-за неизменности. так что вы можете попробовать использовать оператор распространения, чтобы создать новую мелкую копию вашего списка, прежде чем изменить его.

как использовать оператор распространения (тройная точка)

let newArrayOfWhens = [... this.whens]

затем использовать массив "newArrayOfWhens" в вашем коде

Вы также можете создать глубокого клона, если хотите, но старайтесь избегать его, если в этом нет необходимости. Вы можете использовать библиотечный вызов "lodash", чтобы сделать это очень легко deepClone

...