У меня есть пользовательский компонент Button с пользовательской директивой style
(v-style) для добавления некоторых классов:
directives: {
style: {
bind(el, binding) {
const style = binding.value;
if (!["primary", "success", "error"].includes(style)) {
throw new TypeError(`Button style ${style} not valid`);
}
el.classList.add(`button-${style}`);
}
}
}
И в родительском компоненте я хочу использовать эту директиву следующим образом:
<template>
<div>
<Button v-style="'primary'">Send</Button>
</div>
</template>
Но это не работает. Должен ли я создать глобальную директиву и проверить, связан ли элемент, или есть лучший способ?
Vue.directive("style", {...});