Может кто знаком поглубже как работает реактивность в Vue? у

Question

Может кто знаком поглубже как работает реактивность в Vue? у

меня есть такая проблема. Я передаю филды объекта в компонент через v-bind, и при изменении полей объекта проперти не меняются. Но если передаю целиком как проперти, то все ок.

Объект это не простой. У него для каждого филда есть свои getters/setters. Похоже они и дают это некорректное поведение.

Может кто подскажет, где посмотреть в source code как реализована работа v-bind? Что-то сам я с ходу не нашел

#frontend #javascript #programming #russian #vue.js

0

26.04.2021

19 ответов

11 просмотров

Denis Marusevich Автор вопроса

Grigorii K. Shartsev
Как меняешь внутри компонента?

Эмичу ивент:

0

26.04.2021

Denis Marusevich Автор вопроса

Grigorii K. Shartsev
Как меняешь внутри компонента?

Я скрин выше прикладывал. значение меняется. вернее так: :param="param" - тут в проперти видно что значение поменялось v-bind="param" - а тут старое значение - хотя объект один и тот же

0

26.04.2021

Grigorii K. Shartsev

Denis Marusevich
Я скрин выше прикладывал. значение меняется. верне...

> при изменении полей объекта проперти не меняются Где кто как меняет поля какого объекта?)

0

26.04.2021

Grigorii K. Shartsev

Код v-bind, если нужен, тут https://github.com/vuejs/vue/blob/dev/src/core/instance/render-helpers/bind-object-props.js

0

26.04.2021

Denis Marusevich Автор вопроса

Grigorii K. Shartsev
Код v-bind, если нужен, тут https://github.com/vue...

спасибо!

0

26.04.2021

Denis Marusevich Автор вопроса

Grigorii K. Shartsev
> при изменении полей объекта проперти не меняются...

смотри. вот накидал упрощенный варинт https://codesandbox.io/s/funny-swanson-s8fn0?file=/src/App.vue

0

26.04.2021

Grigorii K. Shartsev

Denis Marusevich
смотри. вот накидал упрощенный варинт https://code...

Да, так работать не будет. В obj хранится прокси к нереактивному объекту. В изменении через прокси изменяется нереактивный объект. Прокси не становится реактивным, как объект

0

26.04.2021

Denis Marusevich Автор вопроса

Grigorii K. Shartsev
Да, так работать не будет. В obj хранится прокси ...

👍 понял, спасибо

0

26.04.2021

Denis Marusevich Автор вопроса

Grigorii K. Shartsev
Да, так работать не будет. В obj хранится прокси ...

хотя смотрю как работает реактивность в вью https://github.com/vuejs/vue/blob/dev/src/core/observer/index.js#L67 https://github.com/vuejs/vue/blob/dev/src/core/observer/index.js#L144 вот попробовал в консольке запустить: const target = { message: 'test' } const handler1 = { get: function(target, prop, receiver) { return 'handler1 ' + target.message }} const proxy1 = new Proxy(target, handler1) Object.keys(proxy1) // ["message"] Object.getOwnPropertyDescriptor(proxy1, 'message'); // {value: "test", writable: true, enumerable: true, configurable: true} вроде бы defineReactive должен и к прокси добавить вьюшные прокси

0

26.04.2021

Grigorii K. Shartsev

Denis Marusevich
хотя смотрю как работает реактивность в вью https:...

https://github.com/vuejs/vue/blob/dev/src/core/observer/index.js#L120 Тут не пройдёт проверку на isPlainObject

0

26.04.2021

Denis Marusevich Автор вопроса

Grigorii K. Shartsev
https://github.com/vuejs/vue/blob/dev/src/core/obs...

спасибо!

0

26.04.2021

Grigorii K. Shartsev

Denis Marusevich
спасибо!

А зачем тебе хранить прокси там?

0

26.04.2021

Denis Marusevich Автор вопроса

Grigorii K. Shartsev
А зачем тебе хранить прокси там?

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

0

26.04.2021

Grigorii K. Shartsev

Denis Marusevich
у нас есть либа на проекте. я из нее достаю список...

Хмм. Универсального решения в голову не приходит. Разве что так или иначе делать для Vue обычный объект и синхронизировать их.

0

26.04.2021

Grigorii K. Shartsev

Denis Marusevich
у нас есть либа на проекте. я из нее достаю список...

А ты можешь повлиять на target?

0

26.04.2021