vue.js сеттер / геттер тоже случается для реквизита? - PullRequest
Новая
       64

vue.js сеттер / геттер тоже случается для реквизита?

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

Допустим, у меня есть родительский компонент, где я инициализирую переменную массива в свойстве данных Vue. Затем я поместил 10000 элементов объекта в этот массив. Это означает, что каждое свойство каждого объекта этого массива будет иметь сеттер / геттер, который Vue сделал для нас.

Теперь, допустим, я передаю этот массив дочернему компоненту в качестве реквизита.

Вопрос 1)

Дочерний компонент 

props:{
  passedArray
},

data(){
  return { 
    childArray:[]
  }
}
created(){
   this.childArray = passedArray
}

Теперь, когда я создал новый массив и установил его равным массиву prop, vue создаст новые сеттеры / геттеры для каждогосвойство каждого объекта childArray? потому что когда vue видит равенство массива, а массив описывается в данных, он создает сеттеры / геттеры для всех. Если он не создает setter / getter, то он проверяет, уже установлены ли объекты переданного массива setter / getter?

Означает ли это, что код этого дочернего компонента победил? Не растет память (RAM) вообще?

2) что если я сделаю что-то подобное в дочернем компоненте 

created(){
   this.childArray = [].concat(passedArray); 
}

а теперь? будет ли он создавать новые сеттеры / геттеры или нет?

это немного увеличит объем оперативной памяти, так как childArray теперь должен хранить ссылки на объекты из sentArray. и в предыдущем случае он просто должен сделать его равным переданному массиву. Правильно?

Вопрос 3)

По моему мнению, он вообще не создает новых сеттеров / геттеров для данных реквизита, если переданный реквизит является объектом или массивом, но я виделinitProps в исходном коде vue, и он все еще создает setter / getter для каждого параметра prop. Это правильно?

1 Ответ

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

Как и вы уже догадались, Vue не создает дополнительных получателей или установщиков, если объект уже реагирует, но ваши корневые элементы данных всегда будут иметь свои собственные независимые получатели / установщики.

Для массивов проверка Vueесли каждый элемент объекта является реактивным, а если нет, то он сделает это так.

Таким образом, оба оператора фактически не будут создавать новые методы получения или установки. Однако, если passedArray является результатом чего-то вроде вызова API (вне реактивности Vue.js), то он будет создан для каждого элемента объекта.

РЕДАКТИРОВАТЬ: Q3

initProps определяет только реквизиты в прототипе компонента, но не делает их реактивными. Если вы хотите проверить, как осуществляется реактивность, вы можете взглянуть на src/core/observer/index.js в источнике Vue.

...