一味的闷头开发,却对基础概念缺少理解,是个大坑... 查阅官网后现对本身的理解记录一下,用于往后复习巩固vue
Vue.extend({}) 简述:使用vue.extend返回一个子类构造函数,也就是预设部分选项的vue实例构造器。函数
后可以使用vue.component进行实例化、或使用new extendName().$mount(''+el)方式进行实例化(从而实现模拟组件)。spa
1 let Footer = Vuew.extend({ 2 data(){ 3 return { 4 footerName:'I CAN DO IT...' 5 } 6 }, 7 template:'<div>{{footerName}}</div>' 8 });
Vue.component({})简述:很少介绍了。。。用于生成全局组件code
使用:component
1,Vue.component使用Vue.extend生成的构造函数:blog
Vue.component('footer-view',Footer);
2,实例化构造函数从而模拟组件:ip
new Footer({ data:{ '...':'' } }).$mount('my-footer')
完整代码:开发
<template> <my-footer></my-footer> </template> <script> let Footer = Vuew.extend({ data(){ return { footerName:'I CAN DO IT...' } }, template:'<div>{{footerName}}</div>' }); Vue.component('footer-view',Footer); // new Footer({ // data:{ // '...':'' // } // }).$mount('my-footer') </script>
如有什么错误,欢迎指正。。。class