Моя пользовательская директива vue в файле. vue не выполняется

Question

Я впервые создал пользовательскую директиву Vue. Но директива не инициализирована. Я попробовал новый проект и кодекс тоже. Я действительно не знаю проблемы!

Это мой Vue компонент:

<template>
  <div id="app">
    <div my-test>Some text...</div>
  </div>
</template>

<script>
export default {
  name: "App",
  directives: {
    "my-test": function(el) {
      el.style.backgroundColor = "red";
      console.log("This is my first directive!");
    }
  }
};
</script>

Песочница: https://codesandbox.io/s/angry-khorana-uuhd0?file= / src / App. vue

Спасибо

Answer 1

Чтобы обеспечить соответствие стандартам именования (иметь в имени - da sh) и избежать конфликтов, по умолчанию все директивы, зарегистрированные Vue, автоматически имеют префикс v-.

Поэтому измените разметку на <div v-my-test>...</div>. Посмотри работает .