This content originally appeared on CodeSource.io and was authored by Prince Chukwudire
In this article, you will learn how to register components locally and globally, to avoid the ‘unknown custom element error‘.
Global Registration: Global registration of components is achieved using the Vue.component
directive.
import Vue from "vue";
import App from "./App.vue";
// Import Custom Component
import newComponent from './newComponent.vue';
Vue.config.productionTip = false;
// Register component Globally
Vue.component('newComponent ', newComponent );
new Vue({
render: h => h(App)
}).$mount("#app");
This gives us access to make use of our component in any component.
<template>
<div>
<newComponent>
</newComponent>
</div>
</template>
Local Registration: We can also register our components locally by importing and registering them within the needed component.
<script>
import newComponent from "./newComponent";
export default {
components: {
newComponent,
},
};
</script>
We can then use it within our component.
<template>
<div>
<newComponent>
</newComponent>
</div>
</template>
The post Fix ‘Unknown Custom Element’ in vue appeared first on CodeSource.io.
This content originally appeared on CodeSource.io and was authored by Prince Chukwudire
Prince Chukwudire | Sciencx (2021-03-02T16:20:43+00:00) Fix ‘Unknown Custom Element’ in vue. Retrieved from https://www.scien.cx/2021/03/02/fix-unknown-custom-element-in-vue/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.