title: How to register a custom directive in Vue
body: <p>In VueJs Docs, <a href="https://vuejs.org/guide/custom-directive.html" rel="noreferrer">https://vuejs.org/guide/custom-directive.html</a>
  I can easily create a custom directive using the native <code>Vue.directive</code> method</p>
  
  <p>My question is how would you be able to create a custom directive inside an <code>export default {}</code> </p>
  
  <p>the same as when registering a component or prop:</p>
  
  <pre><code>components: {
     Component1, Component2
  },
  methods: {
     method1() {
      // code here
     }
  },
  </code></pre>