此方法较为简单,推荐使用
全局组件
<!DOCTYPE html><html><head lang="en"><meta charset="UTF-8"><title></title><script src="js/vue1.0.js"></script></head><body><div id="example"><my-component></my-component> </div><script>window.onload=function(){//注册全局组件ponent('my-component', {template: '<div>这是一个全局组件!</div>'});new Vue({el: '#example'})}</script></body></html>
局部组件
<!DOCTYPE html><html><head lang="en"><meta charset="UTF-8"><title></title><script src="js/vue.js"></script></head><body><div id="example"><my-component></my-component> </div><script>window.onload=function(){new Vue({el: '#example',data:{},components:{'my-component':{template: '<div>这是一个局部组件!</div>'}}})}</script></body></html>