Vue JS 2: Изменение binding.value в custom directive

#javascript #vuejs

Интересует возможность изменения входящего параметра в дериктиве. 

Пример не рабочего кода:

Шаблон:




Дериктива:

Vue.directive('my-directive', {
    twoWay: true,
    update: function(el, binding) {
        binding.value = el.scrollHeight;
    }
});


Много информации пересмотрел, конкретного решения не нашел. Изменять через HTMLElement.dataset
не возможно, v-bind на пользовательском аттрибуте не работает. В официальной документации
binding следует понимать как только для чтения и никогда не изменять его. У Evan You
на github был пример решения подобной проблемы, но репозиторий был удален.

Данную дериктиву использую в компонентах, через $vm0 напрямую изменять нет возможности.

Есть ли сбособ изменить значение binding.value в самой дериктиве, не прибегая к артрибутам
тега?
    

Ответы

Ответ 1

На сколько я понял, вы хотите изменить значение передаваемого в директиву аргумента,
причем не просто изменить его внутри директивы, а у компонента в котором создана дитектива.
Если так то рекомендую вам обратиться к атрибуту vnode метода bind 

https://vuejs.org/v2/guide/custom-directive.html#Directive-Hook-Arguments
https://vuejs.org/v2/api/#VNode-Interface

Его свойство context - и есть ссылка на компонент в котором создана директива.

Vue.directive('my-directive', {
    bind: function (el, binding, vnode) {
        vnode.context.poss.y = 7;
    }
});


Вот фиддл - при создании свойство poss.y имеет значение "2", при создании директивы
оно обновляется на "7", проверить это можно нажав на элемент.