How to make a Base component that will allow other components to inherit new functionality or code from it in Vue JS

Viewed 224

Component 1:-

<template>
<blur :isData="isData">
 
    <!-- logic/implementation of component 1 -->
    <div>
    
    </div>


</blur>
<template>

<script>

import blur from "../shared/Blur";

 name: "component-1",
  components: {
    blur,
  },

</script>

Just like this component1.vue, I have multiple components which are using blur component. Is it possible that instead of writing and importing blur in every single component, I can make some base class that can transfer the blur functionality in every single component in the folder. Can something like this be achieved in vue ?

1 Answers

With Vue.component you can create globally registered components:

Vue.component('my-component-name', {
  // ... options ...
})

Find out more here

Related