Как использовать директиву vuejs при условии?

Я подаю в суд на директиву https://github.com/DominikSerafin/vuebar в своем проекте. Теперь, в зависимости от некоторого var, я хочу использовать его в html или нет.

Как это

<div v-bar>
//this div contains huge html like 1200 lines of code and doing
// v-if is not option since i will have to duplicate all of its content
</div>

Итак, резюмируя:

<div v-bar v-if="somevar"></div> // is not and option bceuse that div contains 1200 of code

Есть ли способ, которым я могу сказать что-то вроде:

<div some_var ? v-bar:''></div>

Или сделать так, чтобы моя директива наследовала этот v-bar и рендеринг?


vue.js vuejs2 vue-directives
person pregmatch    schedule 12.07.2018    source источник

Ответы (2)


arrow_upward
1
arrow_downward

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

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

Напишите логику, делать ли что-то или нет для директивы внутри кода директивы в зависимости от значений привязки.

Прочтите это, прокомментируйте, если что-то непонятно .

person Ankit Kumar Ojha    schedule 12.07.2018

arrow_upward
0
arrow_downward

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

Публичные методы.

Вы можете получить к ним доступ из контекста вашего компонента: this.$vuebar. В качестве альтернативы вы можете получить к ним доступ из своего основного экземпляра Vue: Vue.vuebar. Каждый метод должен передавать элемент контейнера прокрутки Vuebar в качестве первого аргумента. Вы можете сделать это легко, используя $refs.

initScrollbar(DOM Element, options)
getState(DOM Element)
refreshScrollbar(DOM Element, options)
destroyScrollbar(DOM Element)
person Max Sinev    schedule 12.07.2018