Vue组件如何使用及个人对其理解与介绍有哪些要点？

本文共计5473个文字，预计阅读时间需要22分钟。

组件的基本使用+注册组件+注册组件就是使用Vue.component()方法，先传入一个自定义组件的名称，然后传入这个组件的配置。例如：Vue.component('mycomponent', { template: 'div这是一个自定义组件/div' });

组件的基本使用

注册组件

注册组件就是利用Vue.component()方法，先传入一个自定义组件的名字，然后传入这个组件的配置。

Vue.component('mycomponent',{ template: `<div>这是一个自定义组件</div>`, data () { return { message: 'hello world' } } })

如上方式，就已经创建了一个自定义组件，然后就可以在Vue实例挂在的DOM元素中使用它。

<div id="app"> <mycomponent></mycomponent> <my-component></my-component> </div> <script> var app = new Vue({ el: '#app', data: { }, components: { 'my-component': { template: `<div>这是一个局部的自定义组件，只能在当前Vue实例中使用</div>`, } } }) </script>

直接使用Vue.component()创建的组件，所有的Vue实例都可以使用。