大体思路 (三)
1. 子类父类
2.Vue.extend() //创建vue的子类
组件的语法器 Vue.extend(options)
Profile().$mount('#app') // 挂在app上,并替换app
新建 initExend
==》 Vue.extend
3. strat.data
==> if(!vm){子组件中data的值是一个方法function ==> mergeDataorFn()} // 数据的合并
==> else {} //通过实例绑定的data 实际是一个函数 mergeDataorFn
==》 mergeDataorFn if(!vm) mergeDataFn ==> mergeData()
else ==》mergedInstanceDataFn ==>mergeData()
mergeData(to,from) //终极合并
jquery.extend // 深copy和浅copy
1 // 大体思路 (二) 2 // 1. 子类父类 3 /* 4 2.Vue.extend() //创建vue的子类 5 组件的语法器 Vue.extend(options) 6 Profile().$mount('#app') // 挂在app上,并替换app 7 新建 initExend 8 ==》 Vue.extend 9 10 */ 11 /* 3. strat.data 12 ==> if(!vm){子组件中data的值是一个方法function ==> mergeDataorFn()} // 数据的合并 13 ==> else {} //通过实例绑定的data 实际是一个函数 mergeDataorFn 14 ==》 mergeDataorFn if(!vm) mergeDataFn ==> mergeData() 15 else ==》mergedInstanceDataFn ==>mergeData() 16 mergeData(to,from) //终极合并 17 jquery.extend // 深copy和浅copy 18 */ 19 20 21 22 (function(global,factory){ 23 // 兼容 cmd 24 typeof exports === 'object' && module !== 'undefined' ? module.exports = factory(): 25 // Amd 26 typeof define === 'function' && define.amd ? define(factory) : global.Vue = factory(); 27 })(this,function(){ 28 var uip = 0; 29 function warn(string){ 30 console.error('Vue Wran:' + string) 31 } 32 33 function resolveConstructorOptions(Con){ 34 var options = Con.options; 35 // 判断是否为vm的实例 或者是子类 36 return options 37 } 38 var hasOwnPropeerty = Object.prototype.hasOwnProperty 39 function hasOwn(obj , key){ 40 return hasOwnPropeerty.call(obj,key) 41 } 42 function makeMap(str, expectsLoweraseC){ 43 if(expectsLoweraseC){ 44 str = str.toLowerCase() 45 } 46 var map = Object.create(null) 47 var list = str.split(',') 48 for(var i = 0 ; i < list.length; i++){ 49 map[list[i]] = true 50 } 51 return function(key){ 52 return map[key] 53 54 } 55 } 56 var isbuiltInTag = makeMap('slot,component',true) 57 var isHTMLTag = makeMap( 58 'html,body,base,head,link,meta,style,title,' + 59 'address,article,aside,footer,header,h1,h2,h3,h4,h5,h6,hgroup,nav,section,' + 60 'div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,' + 61 'a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,rtc,ruby,' + 62 's,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,' + 63 'embed,object,param,source,canvas,script,noscript,del,ins,' + 64 'caption,col,colgroup,table,thead,tbody,td,th,tr,' + 65 'button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,' + 66 'output,progress,select,textarea,' + 67 'details,dialog,menu,menuitem,summary,' + 68 'content,element,shadow,template,blockquote,iframe,tfoot' 69 ); 70 var isSVG = makeMap( 71 'svg,animate,circle,clippath,cursor,defs,desc,ellipse,filter,font-face,' + 72 'foreignObject,g,glyph,image,line,marker,mask,missing-glyph,path,pattern,' + 73 'polygon,polyline,rect,switch,symbol,text,textpath,tspan,use,view', 74 true 75 ); 76 var isReservedTag = function(key){ 77 return isHTMLTag(key) || isSVG(key) 78 } 79 function validataComponentName(key){ 80 //检测component 的自定义名称是否合格 81 // 只能是字母