Summary of several ways to register components in Vue

Below I will share with you a summary of several ways to register components in Vue. It has a good reference value and I hope it will be helpful to everyone.

1. Global registration (components registered in this way must be declared before vue is instantiated)

Vue.component('tag-name',{})

2. Partial registration

var Child = {
 template: &#39;<p>A custom component!</p>&#39;
}
new Vue({
 // ...
 components: {
 // <my-component> 将只在父模板可用
 &#39;my-component&#39;: Child
 }
})

3. Extended instance

// 定义一个混合对象
var myMixin = {
 created: function () {
 this.hello()
 },
 methods: {
 hello: function () {
  console.log('hello from mixin!')
 }
 }
}
// 定义一个使用混合对象的组件
var Component = Vue.extend({
 mixins: [myMixin]
})
var component = new Component() // -> "hello from mixin!"

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

Angular uses the operation event instruction ng-click to pass multiple parameters example

JavaScript code to implement txt File upload preview function

Angularjs implementation example summary of communication between controllers

The above is the detailed content of Summary of several ways to register components in Vue. For more information, please follow other related articles on the PHP Chinese website!