Свойство объекта становится пустым в vue - PullRequest
0 голосов
/ 09 января 2020

Я пытаюсь реализовать метод фильтра в Vue компоненте.

У меня есть метод фильтра ниже:

    filterHotels:function(){

            var thisHotels = this.hotelRoomArr;

            console.log(this.hotelRoomArr['107572']['rooms'])

            //this outputs:

            {__ob__: Observer}
            3: (...)
            __ob__: Observer {value: {…}, dep: Dep, vmCount: 0}
            get 3: ƒ reactiveGetter()
            set 3: ƒ reactiveSetter(newVal)
            __proto__: Object


            thisHotels['107572']['rooms'] = {};

            console.log(this.hotelRoomArr['107572']['rooms']);

            //this outputs:

            {__ob__: Observer}
            __ob__: Observer {value: {…}, dep: Dep, vmCount: 0}
            __proto__: Object
    }

Как видно из кода выше:

Хотя Я устанавливаю комнаты свойство thisHotels для пустого объекта, комнаты свойство this.hotelRoomArr также меняется.

Логически номеров свойство this.hotelRoomArr не должно изменяться.

Что мне нужно сделать, чтобы this.hotelRoomArr не изменилось переодеться?

Ответы [ 3 ]

2 голосов
/ 09 января 2020

Когда вы делаете var thisHotels = this.hotelRoomArr;, thisHotels становится ссылкой.

Попробуйте использовать функцию lodash cloneDeep:

https://lodash.com/docs/4.17.15#cloneDeep

import cloneDeep from 'lodash/cloneDeep';

...

var thisHotels = cloneDeep(this.hotelRoomArr);

Вместо этого будет сделана копия, и изменения не будут затронуты this.hotelRoomArr

1 голос
/ 09 января 2020

его, потому что когда вы делаете это var thisHotels = this.hotelRoomArr;

thisHotels становится ссылкой на this.hotelRoomArr, когда вы изменяете одно, оно изменяет другое.

, если вы хотите не Ссылка на копию объекта, вы можете сделать это:

let thisHotels = JSON.parse(JSON.stringify(this.hotelRoomArr))

Я лично использую JSON путь объекта

0 голосов
/ 09 января 2020

При создании локальной переменной thisHotels распространяйте hotelRoomArr вместо того, чтобы приравнивать его. Это может решить проблему.

//top code
var thisHotels = [...this.hotelRoomArr]
//remaining code

PS: лучше использовать let вместо var

...