VueJS Components

Components in VueJS creates custom elements, which can be reused in HTML and loads independently.
At a high level, Components are custom elements that Vue.js’ compiler would attach specified behavior to. In some cases, they may also appear as a native HTML element extended with the special is attribute.

The component’s name is the first argument of Vue.component
Component naming conventions are kebab-case and PascalCase


   Vue.component('my-component-name', {


   Vue.component('ComponentName', { 
       /* ... */ 

Creating a component:

To create a component in Vue, first we need to register a component, component registration can be done locally or globally.

Global Registration:

Here the components will be a part of entire application.

   Vue.component('my-component-name', {
      // ... logic ...

Local Registration:

Here the components will be a part of only the vue instance created.

  new Vue({
  el: '#app',
  components: {
    'component-a': Component1