[{"data":1,"prerenderedAt":16760},["ShallowReactive",2],{"article-frontend\u002Fvue3typescript":3},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":9,"date":10,"tags":11,"body":13,"_type":16754,"_id":16755,"_source":16756,"_file":16757,"_stem":16758,"_extension":16759},"\u002Farticles\u002Ffrontend\u002Fvue3typescript","frontend",false,"","Vue3 与 TypeScript 全面学习笔记","涵盖 Vue3 核心特性、组合式API、Vue Router、TypeScript 类型系统及两者配合使用的完整学习笔记","2023-03-23",[12],"软件工程",{"type":14,"children":15,"toc":16657},"root",[16,24,55,60,66,292,298,303,315,322,332,337,362,367,376,381,453,458,500,509,514,985,990,1251,1257,1262,1487,1492,1618,1623,1628,1633,1642,1689,1694,1704,1709,1717,1746,1754,1997,2003,2016,2108,2116,2256,2261,2314,2320,2384,2390,2395,2409,2414,2430,2435,2443,2509,2517,2522,2576,2581,2616,2621,2629,2877,2885,3135,3141,3149,3664,3669,3677,3682,4094,4102,4397,4402,5472,5477,5490,6104,6110,6123,6827,6832,6840,7267,7534,7539,7741,7747,7753,7761,8013,8018,8026,8320,8326,8334,8347,8758,8762,8887,8893,8898,8911,8919,9217,9225,9470,9476,9484,9489,9761,9769,10081,10087,10092,10112,10130,10135,10143,10188,10193,10207,10212,10242,10247,10252,10734,10739,10791,10796,10801,10806,10811,10819,10970,10978,11117,11123,11128,11147,11158,11164,11177,11277,11285,11377,11382,11532,11538,11543,11554,11682,11687,11692,11722,11727,11732,11762,11767,11775,11780,11785,11977,11982,11987,12032,12037,12042,12110,12115,12120,12128,12419,12424,12578,12583,13124,13129,13137,13142,13165,13170,13213,13218,13231,13254,13259,13264,13758,13763,13824,13829,13834,13842,13865,13869,14002,14006,14208,14213,14221,14296,14301,14309,14608,14616,14823,14828,14836,14955,14963,15092,15097,15105,15167,15172,15176,15189,15420,15425,15433,15441,15543,15548,15553,15561,15592,15599,15663,15669,15675,15696,15760,15766,15774,15794,15800,15808,15814,15819,15825,15878,15884,15890,16119,16125,16300,16306,16456,16462,16467,16548,16553,16646,16652],{"type":17,"tag":18,"props":19,"children":21},"element","h1",{"id":20},"vue-router打开新的页签",[22],{"type":23,"value":20},"text",{"type":17,"tag":25,"props":26,"children":30},"pre",{"className":27,"code":28,"language":29,"meta":7,"style":7},"language-plain shiki shiki-themes github-dark","const url = router.resolve('\u002FproTemperature')\nwindow.open(url.href, '_blank')\n","plain",[31],{"type":17,"tag":32,"props":33,"children":34},"code",{"__ignoreMap":7},[35,46],{"type":17,"tag":36,"props":37,"children":40},"span",{"class":38,"line":39},"line",1,[41],{"type":17,"tag":36,"props":42,"children":43},{},[44],{"type":23,"value":45},"const url = router.resolve('\u002FproTemperature')\n",{"type":17,"tag":36,"props":47,"children":49},{"class":38,"line":48},2,[50],{"type":17,"tag":36,"props":51,"children":52},{},[53],{"type":23,"value":54},"window.open(url.href, '_blank')\n",{"type":17,"tag":18,"props":56,"children":58},{"id":57},"uniapp",[59],{"type":23,"value":57},{"type":17,"tag":61,"props":62,"children":64},"h2",{"id":63},"样式穿透",[65],{"type":23,"value":63},{"type":17,"tag":25,"props":67,"children":71},{"className":68,"code":69,"language":70,"meta":7,"style":7},"language-css shiki shiki-themes github-dark","::v-deep {\n .select-annual {\n .uni-select {\n min-width: 150rpx;\n background-color: #fff;\n border: none;\n border-radius: 0;\n border-bottom-left-radius: 35rpx;\n border-top-left-radius: 35rpx;\n }\n }\n}\n","css",[72],{"type":17,"tag":32,"props":73,"children":74},{"__ignoreMap":7},[75,95,113,131,155,178,200,222,244,265,274,283],{"type":17,"tag":36,"props":76,"children":77},{"class":38,"line":39},[78,84,90],{"type":17,"tag":36,"props":79,"children":81},{"style":80},"--shiki-default:#E1E4E8",[82],{"type":23,"value":83},"::",{"type":17,"tag":36,"props":85,"children":87},{"style":86},"--shiki-default:#85E89D",[88],{"type":23,"value":89},"v-deep",{"type":17,"tag":36,"props":91,"children":92},{"style":80},[93],{"type":23,"value":94}," {\n",{"type":17,"tag":36,"props":96,"children":97},{"class":38,"line":48},[98,103,109],{"type":17,"tag":36,"props":99,"children":100},{"style":80},[101],{"type":23,"value":102}," .",{"type":17,"tag":36,"props":104,"children":106},{"style":105},"--shiki-default:#79B8FF",[107],{"type":23,"value":108},"select-annual",{"type":17,"tag":36,"props":110,"children":111},{"style":80},[112],{"type":23,"value":94},{"type":17,"tag":36,"props":114,"children":116},{"class":38,"line":115},3,[117,122,127],{"type":17,"tag":36,"props":118,"children":119},{"style":80},[120],{"type":23,"value":121}," .",{"type":17,"tag":36,"props":123,"children":124},{"style":105},[125],{"type":23,"value":126},"uni-select",{"type":17,"tag":36,"props":128,"children":129},{"style":80},[130],{"type":23,"value":94},{"type":17,"tag":36,"props":132,"children":134},{"class":38,"line":133},4,[135,140,145,150],{"type":17,"tag":36,"props":136,"children":137},{"style":105},[138],{"type":23,"value":139}," min-width",{"type":17,"tag":36,"props":141,"children":142},{"style":80},[143],{"type":23,"value":144},": ",{"type":17,"tag":36,"props":146,"children":147},{"style":105},[148],{"type":23,"value":149},"150",{"type":17,"tag":36,"props":151,"children":152},{"style":80},[153],{"type":23,"value":154},"rpx;\n",{"type":17,"tag":36,"props":156,"children":158},{"class":38,"line":157},5,[159,164,168,173],{"type":17,"tag":36,"props":160,"children":161},{"style":105},[162],{"type":23,"value":163}," background-color",{"type":17,"tag":36,"props":165,"children":166},{"style":80},[167],{"type":23,"value":144},{"type":17,"tag":36,"props":169,"children":170},{"style":105},[171],{"type":23,"value":172},"#fff",{"type":17,"tag":36,"props":174,"children":175},{"style":80},[176],{"type":23,"value":177},";\n",{"type":17,"tag":36,"props":179,"children":181},{"class":38,"line":180},6,[182,187,191,196],{"type":17,"tag":36,"props":183,"children":184},{"style":105},[185],{"type":23,"value":186}," border",{"type":17,"tag":36,"props":188,"children":189},{"style":80},[190],{"type":23,"value":144},{"type":17,"tag":36,"props":192,"children":193},{"style":105},[194],{"type":23,"value":195},"none",{"type":17,"tag":36,"props":197,"children":198},{"style":80},[199],{"type":23,"value":177},{"type":17,"tag":36,"props":201,"children":203},{"class":38,"line":202},7,[204,209,213,218],{"type":17,"tag":36,"props":205,"children":206},{"style":105},[207],{"type":23,"value":208}," border-radius",{"type":17,"tag":36,"props":210,"children":211},{"style":80},[212],{"type":23,"value":144},{"type":17,"tag":36,"props":214,"children":215},{"style":105},[216],{"type":23,"value":217},"0",{"type":17,"tag":36,"props":219,"children":220},{"style":80},[221],{"type":23,"value":177},{"type":17,"tag":36,"props":223,"children":225},{"class":38,"line":224},8,[226,231,235,240],{"type":17,"tag":36,"props":227,"children":228},{"style":105},[229],{"type":23,"value":230}," border-bottom-left-radius",{"type":17,"tag":36,"props":232,"children":233},{"style":80},[234],{"type":23,"value":144},{"type":17,"tag":36,"props":236,"children":237},{"style":105},[238],{"type":23,"value":239},"35",{"type":17,"tag":36,"props":241,"children":242},{"style":80},[243],{"type":23,"value":154},{"type":17,"tag":36,"props":245,"children":247},{"class":38,"line":246},9,[248,253,257,261],{"type":17,"tag":36,"props":249,"children":250},{"style":105},[251],{"type":23,"value":252}," border-top-left-radius",{"type":17,"tag":36,"props":254,"children":255},{"style":80},[256],{"type":23,"value":144},{"type":17,"tag":36,"props":258,"children":259},{"style":105},[260],{"type":23,"value":239},{"type":17,"tag":36,"props":262,"children":263},{"style":80},[264],{"type":23,"value":154},{"type":17,"tag":36,"props":266,"children":268},{"class":38,"line":267},10,[269],{"type":17,"tag":36,"props":270,"children":271},{"style":80},[272],{"type":23,"value":273}," }\n",{"type":17,"tag":36,"props":275,"children":277},{"class":38,"line":276},11,[278],{"type":17,"tag":36,"props":279,"children":280},{"style":80},[281],{"type":23,"value":282}," }\n",{"type":17,"tag":36,"props":284,"children":286},{"class":38,"line":285},12,[287],{"type":17,"tag":36,"props":288,"children":289},{"style":80},[290],{"type":23,"value":291},"}\n",{"type":17,"tag":18,"props":293,"children":295},{"id":294},"vue3",[296],{"type":23,"value":297},"Vue3",{"type":17,"tag":61,"props":299,"children":301},{"id":300},"vue3小技巧",[302],{"type":23,"value":300},{"type":17,"tag":304,"props":305,"children":307},"h3",{"id":306},"getcurrentinstance获取全局变量",[308],{"type":17,"tag":309,"props":310,"children":312},"font",{"style":311},"color:rgb(34, 34, 38);",[313],{"type":23,"value":314},"getCurrentInstance获取全局变量",{"type":17,"tag":316,"props":317,"children":319},"h4",{"id":318},"在maints中定义全局变量",[320],{"type":23,"value":321},"在main.ts中定义全局变量",{"type":17,"tag":323,"props":324,"children":325},"p",{},[326],{"type":17,"tag":32,"props":327,"children":329},{"className":328},[],[330],{"type":23,"value":331},"app.config.globalProperties.$api = '111'",{"type":17,"tag":316,"props":333,"children":335},{"id":334},"在页面中使用",[336],{"type":23,"value":334},{"type":17,"tag":25,"props":338,"children":342},{"className":339,"code":340,"language":341,"meta":7,"style":7},"language-vue shiki shiki-themes github-dark","const { proxy } = getCurrentInstance() as ComponentInternalInstance;\nconsole.log(proxy.$api)\n","vue",[343],{"type":17,"tag":32,"props":344,"children":345},{"__ignoreMap":7},[346,354],{"type":17,"tag":36,"props":347,"children":348},{"class":38,"line":39},[349],{"type":17,"tag":36,"props":350,"children":351},{"style":80},[352],{"type":23,"value":353},"const { proxy } = getCurrentInstance() as ComponentInternalInstance;\n",{"type":17,"tag":36,"props":355,"children":356},{"class":38,"line":48},[357],{"type":17,"tag":36,"props":358,"children":359},{"style":80},[360],{"type":23,"value":361},"console.log(proxy.$api)\n",{"type":17,"tag":304,"props":363,"children":365},{"id":364},"依赖注入",[366],{"type":23,"value":364},{"type":17,"tag":368,"props":369,"children":370},"blockquote",{},[371],{"type":17,"tag":323,"props":372,"children":373},{},[374],{"type":23,"value":375},"后代组件改变值，父组件也会跟着改变",{"type":17,"tag":323,"props":377,"children":378},{},[379],{"type":23,"value":380},"provide：",{"type":17,"tag":25,"props":382,"children":386},{"className":383,"code":384,"language":385,"meta":7,"style":7},"language-javascript shiki shiki-themes github-dark","const message = ref('hello')\nprovide('message', message)\n","javascript",[387],{"type":17,"tag":32,"props":388,"children":389},{"__ignoreMap":7},[390,431],{"type":17,"tag":36,"props":391,"children":392},{"class":38,"line":39},[393,399,404,409,415,420,426],{"type":17,"tag":36,"props":394,"children":396},{"style":395},"--shiki-default:#F97583",[397],{"type":23,"value":398},"const",{"type":17,"tag":36,"props":400,"children":401},{"style":105},[402],{"type":23,"value":403}," message",{"type":17,"tag":36,"props":405,"children":406},{"style":395},[407],{"type":23,"value":408}," =",{"type":17,"tag":36,"props":410,"children":412},{"style":411},"--shiki-default:#B392F0",[413],{"type":23,"value":414}," ref",{"type":17,"tag":36,"props":416,"children":417},{"style":80},[418],{"type":23,"value":419},"(",{"type":17,"tag":36,"props":421,"children":423},{"style":422},"--shiki-default:#9ECBFF",[424],{"type":23,"value":425},"'hello'",{"type":17,"tag":36,"props":427,"children":428},{"style":80},[429],{"type":23,"value":430},")\n",{"type":17,"tag":36,"props":432,"children":433},{"class":38,"line":48},[434,439,443,448],{"type":17,"tag":36,"props":435,"children":436},{"style":411},[437],{"type":23,"value":438},"provide",{"type":17,"tag":36,"props":440,"children":441},{"style":80},[442],{"type":23,"value":419},{"type":17,"tag":36,"props":444,"children":445},{"style":422},[446],{"type":23,"value":447},"'message'",{"type":17,"tag":36,"props":449,"children":450},{"style":80},[451],{"type":23,"value":452},", message)\n",{"type":17,"tag":323,"props":454,"children":455},{},[456],{"type":23,"value":457},"inject：",{"type":17,"tag":25,"props":459,"children":461},{"className":383,"code":460,"language":385,"meta":7,"style":7},"let message = inject('message')\n",[462],{"type":17,"tag":32,"props":463,"children":464},{"__ignoreMap":7},[465],{"type":17,"tag":36,"props":466,"children":467},{"class":38,"line":39},[468,473,478,483,488,492,496],{"type":17,"tag":36,"props":469,"children":470},{"style":395},[471],{"type":23,"value":472},"let",{"type":17,"tag":36,"props":474,"children":475},{"style":80},[476],{"type":23,"value":477}," message ",{"type":17,"tag":36,"props":479,"children":480},{"style":395},[481],{"type":23,"value":482},"=",{"type":17,"tag":36,"props":484,"children":485},{"style":411},[486],{"type":23,"value":487}," inject",{"type":17,"tag":36,"props":489,"children":490},{"style":80},[491],{"type":23,"value":419},{"type":17,"tag":36,"props":493,"children":494},{"style":422},[495],{"type":23,"value":447},{"type":17,"tag":36,"props":497,"children":498},{"style":80},[499],{"type":23,"value":430},{"type":17,"tag":304,"props":501,"children":503},{"id":502},"小技巧",[504,508],{"type":17,"tag":505,"props":506,"children":507},"style",{},[],{"type":23,"value":502},{"type":17,"tag":323,"props":510,"children":511},{},[512],{"type":23,"value":513},"属性名与css相同，属性值就是css属性值",{"type":17,"tag":25,"props":515,"children":517},{"className":339,"code":516,"language":341,"meta":7,"style":7},"\u003Cscript setup>\n const color = ref(\"green\");\n const backgroundColor = ref(\"red\");\n\n function changeColor() {\n color.value = color.value === \"green\" ? \"pink\" : \"green\";\n backgroundColor.value = backgroundColor.value === \"red\" ? \"blue\" : \"red\";\n }\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003Cdiv class=\"test-container\">\n \u003Cp :style=\"{ color, backgroundColor }\" style=\"width: 100%; height: 300px\" @click=\"changeColor\">我会变颜色\u003C\u002Fp>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n",[518],{"type":17,"tag":32,"props":519,"children":520},{"__ignoreMap":7},[521,544,579,612,621,639,689,736,743,759,766,782,813,952,969],{"type":17,"tag":36,"props":522,"children":523},{"class":38,"line":39},[524,529,534,539],{"type":17,"tag":36,"props":525,"children":526},{"style":80},[527],{"type":23,"value":528},"\u003C",{"type":17,"tag":36,"props":530,"children":531},{"style":86},[532],{"type":23,"value":533},"script",{"type":17,"tag":36,"props":535,"children":536},{"style":411},[537],{"type":23,"value":538}," setup",{"type":17,"tag":36,"props":540,"children":541},{"style":80},[542],{"type":23,"value":543},">\n",{"type":17,"tag":36,"props":545,"children":546},{"class":38,"line":48},[547,552,557,561,565,569,574],{"type":17,"tag":36,"props":548,"children":549},{"style":395},[550],{"type":23,"value":551}," const",{"type":17,"tag":36,"props":553,"children":554},{"style":105},[555],{"type":23,"value":556}," color",{"type":17,"tag":36,"props":558,"children":559},{"style":395},[560],{"type":23,"value":408},{"type":17,"tag":36,"props":562,"children":563},{"style":411},[564],{"type":23,"value":414},{"type":17,"tag":36,"props":566,"children":567},{"style":80},[568],{"type":23,"value":419},{"type":17,"tag":36,"props":570,"children":571},{"style":422},[572],{"type":23,"value":573},"\"green\"",{"type":17,"tag":36,"props":575,"children":576},{"style":80},[577],{"type":23,"value":578},");\n",{"type":17,"tag":36,"props":580,"children":581},{"class":38,"line":115},[582,586,591,595,599,603,608],{"type":17,"tag":36,"props":583,"children":584},{"style":395},[585],{"type":23,"value":551},{"type":17,"tag":36,"props":587,"children":588},{"style":105},[589],{"type":23,"value":590}," backgroundColor",{"type":17,"tag":36,"props":592,"children":593},{"style":395},[594],{"type":23,"value":408},{"type":17,"tag":36,"props":596,"children":597},{"style":411},[598],{"type":23,"value":414},{"type":17,"tag":36,"props":600,"children":601},{"style":80},[602],{"type":23,"value":419},{"type":17,"tag":36,"props":604,"children":605},{"style":422},[606],{"type":23,"value":607},"\"red\"",{"type":17,"tag":36,"props":609,"children":610},{"style":80},[611],{"type":23,"value":578},{"type":17,"tag":36,"props":613,"children":614},{"class":38,"line":133},[615],{"type":17,"tag":36,"props":616,"children":618},{"emptyLinePlaceholder":617},true,[619],{"type":23,"value":620},"\n",{"type":17,"tag":36,"props":622,"children":623},{"class":38,"line":157},[624,629,634],{"type":17,"tag":36,"props":625,"children":626},{"style":395},[627],{"type":23,"value":628}," function",{"type":17,"tag":36,"props":630,"children":631},{"style":411},[632],{"type":23,"value":633}," changeColor",{"type":17,"tag":36,"props":635,"children":636},{"style":80},[637],{"type":23,"value":638},"() {\n",{"type":17,"tag":36,"props":640,"children":641},{"class":38,"line":180},[642,647,651,656,661,666,671,676,681,685],{"type":17,"tag":36,"props":643,"children":644},{"style":80},[645],{"type":23,"value":646}," color.value ",{"type":17,"tag":36,"props":648,"children":649},{"style":395},[650],{"type":23,"value":482},{"type":17,"tag":36,"props":652,"children":653},{"style":80},[654],{"type":23,"value":655}," color.value ",{"type":17,"tag":36,"props":657,"children":658},{"style":395},[659],{"type":23,"value":660},"===",{"type":17,"tag":36,"props":662,"children":663},{"style":422},[664],{"type":23,"value":665}," \"green\"",{"type":17,"tag":36,"props":667,"children":668},{"style":395},[669],{"type":23,"value":670}," ?",{"type":17,"tag":36,"props":672,"children":673},{"style":422},[674],{"type":23,"value":675}," \"pink\"",{"type":17,"tag":36,"props":677,"children":678},{"style":395},[679],{"type":23,"value":680}," :",{"type":17,"tag":36,"props":682,"children":683},{"style":422},[684],{"type":23,"value":665},{"type":17,"tag":36,"props":686,"children":687},{"style":80},[688],{"type":23,"value":177},{"type":17,"tag":36,"props":690,"children":691},{"class":38,"line":202},[692,697,701,706,710,715,719,724,728,732],{"type":17,"tag":36,"props":693,"children":694},{"style":80},[695],{"type":23,"value":696}," backgroundColor.value ",{"type":17,"tag":36,"props":698,"children":699},{"style":395},[700],{"type":23,"value":482},{"type":17,"tag":36,"props":702,"children":703},{"style":80},[704],{"type":23,"value":705}," backgroundColor.value ",{"type":17,"tag":36,"props":707,"children":708},{"style":395},[709],{"type":23,"value":660},{"type":17,"tag":36,"props":711,"children":712},{"style":422},[713],{"type":23,"value":714}," \"red\"",{"type":17,"tag":36,"props":716,"children":717},{"style":395},[718],{"type":23,"value":670},{"type":17,"tag":36,"props":720,"children":721},{"style":422},[722],{"type":23,"value":723}," \"blue\"",{"type":17,"tag":36,"props":725,"children":726},{"style":395},[727],{"type":23,"value":680},{"type":17,"tag":36,"props":729,"children":730},{"style":422},[731],{"type":23,"value":714},{"type":17,"tag":36,"props":733,"children":734},{"style":80},[735],{"type":23,"value":177},{"type":17,"tag":36,"props":737,"children":738},{"class":38,"line":224},[739],{"type":17,"tag":36,"props":740,"children":741},{"style":80},[742],{"type":23,"value":282},{"type":17,"tag":36,"props":744,"children":745},{"class":38,"line":246},[746,751,755],{"type":17,"tag":36,"props":747,"children":748},{"style":80},[749],{"type":23,"value":750},"\u003C\u002F",{"type":17,"tag":36,"props":752,"children":753},{"style":86},[754],{"type":23,"value":533},{"type":17,"tag":36,"props":756,"children":757},{"style":80},[758],{"type":23,"value":543},{"type":17,"tag":36,"props":760,"children":761},{"class":38,"line":267},[762],{"type":17,"tag":36,"props":763,"children":764},{"emptyLinePlaceholder":617},[765],{"type":23,"value":620},{"type":17,"tag":36,"props":767,"children":768},{"class":38,"line":276},[769,773,778],{"type":17,"tag":36,"props":770,"children":771},{"style":80},[772],{"type":23,"value":528},{"type":17,"tag":36,"props":774,"children":775},{"style":86},[776],{"type":23,"value":777},"template",{"type":17,"tag":36,"props":779,"children":780},{"style":80},[781],{"type":23,"value":543},{"type":17,"tag":36,"props":783,"children":784},{"class":38,"line":285},[785,790,795,800,804,809],{"type":17,"tag":36,"props":786,"children":787},{"style":80},[788],{"type":23,"value":789}," \u003C",{"type":17,"tag":36,"props":791,"children":792},{"style":86},[793],{"type":23,"value":794},"div",{"type":17,"tag":36,"props":796,"children":797},{"style":411},[798],{"type":23,"value":799}," class",{"type":17,"tag":36,"props":801,"children":802},{"style":80},[803],{"type":23,"value":482},{"type":17,"tag":36,"props":805,"children":806},{"style":422},[807],{"type":23,"value":808},"\"test-container\"",{"type":17,"tag":36,"props":810,"children":811},{"style":80},[812],{"type":23,"value":543},{"type":17,"tag":36,"props":814,"children":816},{"class":38,"line":815},13,[817,822,826,830,834,838,843,848,852,857,861,865,870,874,879,884,889,894,898,903,908,912,917,922,926,930,935,939,944,948],{"type":17,"tag":36,"props":818,"children":819},{"style":80},[820],{"type":23,"value":821}," \u003C",{"type":17,"tag":36,"props":823,"children":824},{"style":86},[825],{"type":23,"value":323},{"type":17,"tag":36,"props":827,"children":828},{"style":80},[829],{"type":23,"value":680},{"type":17,"tag":36,"props":831,"children":832},{"style":411},[833],{"type":23,"value":505},{"type":17,"tag":36,"props":835,"children":836},{"style":80},[837],{"type":23,"value":482},{"type":17,"tag":36,"props":839,"children":840},{"style":422},[841],{"type":23,"value":842},"\"",{"type":17,"tag":36,"props":844,"children":845},{"style":80},[846],{"type":23,"value":847},"{ color, backgroundColor }",{"type":17,"tag":36,"props":849,"children":850},{"style":422},[851],{"type":23,"value":842},{"type":17,"tag":36,"props":853,"children":854},{"style":411},[855],{"type":23,"value":856}," style",{"type":17,"tag":36,"props":858,"children":859},{"style":80},[860],{"type":23,"value":482},{"type":17,"tag":36,"props":862,"children":863},{"style":422},[864],{"type":23,"value":842},{"type":17,"tag":36,"props":866,"children":867},{"style":105},[868],{"type":23,"value":869},"width",{"type":17,"tag":36,"props":871,"children":872},{"style":80},[873],{"type":23,"value":144},{"type":17,"tag":36,"props":875,"children":876},{"style":105},[877],{"type":23,"value":878},"100",{"type":17,"tag":36,"props":880,"children":881},{"style":395},[882],{"type":23,"value":883},"%",{"type":17,"tag":36,"props":885,"children":886},{"style":80},[887],{"type":23,"value":888},"; ",{"type":17,"tag":36,"props":890,"children":891},{"style":105},[892],{"type":23,"value":893},"height",{"type":17,"tag":36,"props":895,"children":896},{"style":80},[897],{"type":23,"value":144},{"type":17,"tag":36,"props":899,"children":900},{"style":105},[901],{"type":23,"value":902},"300",{"type":17,"tag":36,"props":904,"children":905},{"style":395},[906],{"type":23,"value":907},"px",{"type":17,"tag":36,"props":909,"children":910},{"style":422},[911],{"type":23,"value":842},{"type":17,"tag":36,"props":913,"children":914},{"style":80},[915],{"type":23,"value":916}," @",{"type":17,"tag":36,"props":918,"children":919},{"style":411},[920],{"type":23,"value":921},"click",{"type":17,"tag":36,"props":923,"children":924},{"style":80},[925],{"type":23,"value":482},{"type":17,"tag":36,"props":927,"children":928},{"style":422},[929],{"type":23,"value":842},{"type":17,"tag":36,"props":931,"children":932},{"style":80},[933],{"type":23,"value":934},"changeColor",{"type":17,"tag":36,"props":936,"children":937},{"style":422},[938],{"type":23,"value":842},{"type":17,"tag":36,"props":940,"children":941},{"style":80},[942],{"type":23,"value":943},">我会变颜色\u003C\u002F",{"type":17,"tag":36,"props":945,"children":946},{"style":86},[947],{"type":23,"value":323},{"type":17,"tag":36,"props":949,"children":950},{"style":80},[951],{"type":23,"value":543},{"type":17,"tag":36,"props":953,"children":955},{"class":38,"line":954},14,[956,961,965],{"type":17,"tag":36,"props":957,"children":958},{"style":80},[959],{"type":23,"value":960}," \u003C\u002F",{"type":17,"tag":36,"props":962,"children":963},{"style":86},[964],{"type":23,"value":794},{"type":17,"tag":36,"props":966,"children":967},{"style":80},[968],{"type":23,"value":543},{"type":17,"tag":36,"props":970,"children":972},{"class":38,"line":971},15,[973,977,981],{"type":17,"tag":36,"props":974,"children":975},{"style":80},[976],{"type":23,"value":750},{"type":17,"tag":36,"props":978,"children":979},{"style":86},[980],{"type":23,"value":777},{"type":17,"tag":36,"props":982,"children":983},{"style":80},[984],{"type":23,"value":543},{"type":17,"tag":304,"props":986,"children":988},{"id":987},"ref模板引用",[989],{"type":23,"value":987},{"type":17,"tag":25,"props":991,"children":993},{"className":339,"code":992,"language":341,"meta":7,"style":7},"\u003Cscript setup lang=\"ts\">\n import { ref, onMounted } from 'vue'\n\n const el = ref\u003CHTMLInputElement | null>(null)\n \n onMounted(() => {\n el.value?.focus()\n })\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003Cinput ref=\"el\" \u002F>\n\u003C\u002Ftemplate>\n",[994],{"type":17,"tag":32,"props":995,"children":996},{"__ignoreMap":7},[997,1030,1053,1060,1113,1121,1143,1161,1169,1184,1191,1206,1236],{"type":17,"tag":36,"props":998,"children":999},{"class":38,"line":39},[1000,1004,1008,1012,1017,1021,1026],{"type":17,"tag":36,"props":1001,"children":1002},{"style":80},[1003],{"type":23,"value":528},{"type":17,"tag":36,"props":1005,"children":1006},{"style":86},[1007],{"type":23,"value":533},{"type":17,"tag":36,"props":1009,"children":1010},{"style":411},[1011],{"type":23,"value":538},{"type":17,"tag":36,"props":1013,"children":1014},{"style":411},[1015],{"type":23,"value":1016}," lang",{"type":17,"tag":36,"props":1018,"children":1019},{"style":80},[1020],{"type":23,"value":482},{"type":17,"tag":36,"props":1022,"children":1023},{"style":422},[1024],{"type":23,"value":1025},"\"ts\"",{"type":17,"tag":36,"props":1027,"children":1028},{"style":80},[1029],{"type":23,"value":543},{"type":17,"tag":36,"props":1031,"children":1032},{"class":38,"line":48},[1033,1038,1043,1048],{"type":17,"tag":36,"props":1034,"children":1035},{"style":395},[1036],{"type":23,"value":1037}," import",{"type":17,"tag":36,"props":1039,"children":1040},{"style":80},[1041],{"type":23,"value":1042}," { ref, onMounted } ",{"type":17,"tag":36,"props":1044,"children":1045},{"style":395},[1046],{"type":23,"value":1047},"from",{"type":17,"tag":36,"props":1049,"children":1050},{"style":422},[1051],{"type":23,"value":1052}," 'vue'\n",{"type":17,"tag":36,"props":1054,"children":1055},{"class":38,"line":115},[1056],{"type":17,"tag":36,"props":1057,"children":1058},{"emptyLinePlaceholder":617},[1059],{"type":23,"value":620},{"type":17,"tag":36,"props":1061,"children":1062},{"class":38,"line":133},[1063,1067,1072,1076,1080,1084,1089,1094,1099,1104,1109],{"type":17,"tag":36,"props":1064,"children":1065},{"style":395},[1066],{"type":23,"value":551},{"type":17,"tag":36,"props":1068,"children":1069},{"style":105},[1070],{"type":23,"value":1071}," el",{"type":17,"tag":36,"props":1073,"children":1074},{"style":395},[1075],{"type":23,"value":408},{"type":17,"tag":36,"props":1077,"children":1078},{"style":411},[1079],{"type":23,"value":414},{"type":17,"tag":36,"props":1081,"children":1082},{"style":80},[1083],{"type":23,"value":528},{"type":17,"tag":36,"props":1085,"children":1086},{"style":411},[1087],{"type":23,"value":1088},"HTMLInputElement",{"type":17,"tag":36,"props":1090,"children":1091},{"style":395},[1092],{"type":23,"value":1093}," |",{"type":17,"tag":36,"props":1095,"children":1096},{"style":105},[1097],{"type":23,"value":1098}," null",{"type":17,"tag":36,"props":1100,"children":1101},{"style":80},[1102],{"type":23,"value":1103},">(",{"type":17,"tag":36,"props":1105,"children":1106},{"style":105},[1107],{"type":23,"value":1108},"null",{"type":17,"tag":36,"props":1110,"children":1111},{"style":80},[1112],{"type":23,"value":430},{"type":17,"tag":36,"props":1114,"children":1115},{"class":38,"line":157},[1116],{"type":17,"tag":36,"props":1117,"children":1118},{"style":80},[1119],{"type":23,"value":1120}," \n",{"type":17,"tag":36,"props":1122,"children":1123},{"class":38,"line":180},[1124,1129,1134,1139],{"type":17,"tag":36,"props":1125,"children":1126},{"style":411},[1127],{"type":23,"value":1128}," onMounted",{"type":17,"tag":36,"props":1130,"children":1131},{"style":80},[1132],{"type":23,"value":1133},"(() ",{"type":17,"tag":36,"props":1135,"children":1136},{"style":395},[1137],{"type":23,"value":1138},"=>",{"type":17,"tag":36,"props":1140,"children":1141},{"style":80},[1142],{"type":23,"value":94},{"type":17,"tag":36,"props":1144,"children":1145},{"class":38,"line":202},[1146,1151,1156],{"type":17,"tag":36,"props":1147,"children":1148},{"style":80},[1149],{"type":23,"value":1150}," el.value?.",{"type":17,"tag":36,"props":1152,"children":1153},{"style":411},[1154],{"type":23,"value":1155},"focus",{"type":17,"tag":36,"props":1157,"children":1158},{"style":80},[1159],{"type":23,"value":1160},"()\n",{"type":17,"tag":36,"props":1162,"children":1163},{"class":38,"line":224},[1164],{"type":17,"tag":36,"props":1165,"children":1166},{"style":80},[1167],{"type":23,"value":1168}," })\n",{"type":17,"tag":36,"props":1170,"children":1171},{"class":38,"line":246},[1172,1176,1180],{"type":17,"tag":36,"props":1173,"children":1174},{"style":80},[1175],{"type":23,"value":750},{"type":17,"tag":36,"props":1177,"children":1178},{"style":86},[1179],{"type":23,"value":533},{"type":17,"tag":36,"props":1181,"children":1182},{"style":80},[1183],{"type":23,"value":543},{"type":17,"tag":36,"props":1185,"children":1186},{"class":38,"line":267},[1187],{"type":17,"tag":36,"props":1188,"children":1189},{"emptyLinePlaceholder":617},[1190],{"type":23,"value":620},{"type":17,"tag":36,"props":1192,"children":1193},{"class":38,"line":276},[1194,1198,1202],{"type":17,"tag":36,"props":1195,"children":1196},{"style":80},[1197],{"type":23,"value":528},{"type":17,"tag":36,"props":1199,"children":1200},{"style":86},[1201],{"type":23,"value":777},{"type":17,"tag":36,"props":1203,"children":1204},{"style":80},[1205],{"type":23,"value":543},{"type":17,"tag":36,"props":1207,"children":1208},{"class":38,"line":285},[1209,1213,1218,1222,1226,1231],{"type":17,"tag":36,"props":1210,"children":1211},{"style":80},[1212],{"type":23,"value":789},{"type":17,"tag":36,"props":1214,"children":1215},{"style":86},[1216],{"type":23,"value":1217},"input",{"type":17,"tag":36,"props":1219,"children":1220},{"style":411},[1221],{"type":23,"value":414},{"type":17,"tag":36,"props":1223,"children":1224},{"style":80},[1225],{"type":23,"value":482},{"type":17,"tag":36,"props":1227,"children":1228},{"style":422},[1229],{"type":23,"value":1230},"\"el\"",{"type":17,"tag":36,"props":1232,"children":1233},{"style":80},[1234],{"type":23,"value":1235}," \u002F>\n",{"type":17,"tag":36,"props":1237,"children":1238},{"class":38,"line":815},[1239,1243,1247],{"type":17,"tag":36,"props":1240,"children":1241},{"style":80},[1242],{"type":23,"value":750},{"type":17,"tag":36,"props":1244,"children":1245},{"style":86},[1246],{"type":23,"value":777},{"type":17,"tag":36,"props":1248,"children":1249},{"style":80},[1250],{"type":23,"value":543},{"type":17,"tag":304,"props":1252,"children":1254},{"id":1253},"watcheffect",[1255],{"type":23,"value":1256},"watchEffect",{"type":17,"tag":323,"props":1258,"children":1259},{},[1260],{"type":23,"value":1261},"使用watch",{"type":17,"tag":25,"props":1263,"children":1265},{"className":383,"code":1264,"language":385,"meta":7,"style":7},"const todoId = ref(1)\nconst data = ref(null)\n\nwatch(todoId, async () => {\n const response = await fetch(\n `https:\u002F\u002Fjsonplaceholder.typicode.com\u002Ftodos\u002F${todoId.value}`\n )\n data.value = await response.json()\n}, { immediate: true })\n",[1266],{"type":17,"tag":32,"props":1267,"children":1268},{"__ignoreMap":7},[1269,1302,1334,1341,1372,1403,1431,1439,1469],{"type":17,"tag":36,"props":1270,"children":1271},{"class":38,"line":39},[1272,1276,1281,1285,1289,1293,1298],{"type":17,"tag":36,"props":1273,"children":1274},{"style":395},[1275],{"type":23,"value":398},{"type":17,"tag":36,"props":1277,"children":1278},{"style":105},[1279],{"type":23,"value":1280}," todoId",{"type":17,"tag":36,"props":1282,"children":1283},{"style":395},[1284],{"type":23,"value":408},{"type":17,"tag":36,"props":1286,"children":1287},{"style":411},[1288],{"type":23,"value":414},{"type":17,"tag":36,"props":1290,"children":1291},{"style":80},[1292],{"type":23,"value":419},{"type":17,"tag":36,"props":1294,"children":1295},{"style":105},[1296],{"type":23,"value":1297},"1",{"type":17,"tag":36,"props":1299,"children":1300},{"style":80},[1301],{"type":23,"value":430},{"type":17,"tag":36,"props":1303,"children":1304},{"class":38,"line":48},[1305,1309,1314,1318,1322,1326,1330],{"type":17,"tag":36,"props":1306,"children":1307},{"style":395},[1308],{"type":23,"value":398},{"type":17,"tag":36,"props":1310,"children":1311},{"style":105},[1312],{"type":23,"value":1313}," data",{"type":17,"tag":36,"props":1315,"children":1316},{"style":395},[1317],{"type":23,"value":408},{"type":17,"tag":36,"props":1319,"children":1320},{"style":411},[1321],{"type":23,"value":414},{"type":17,"tag":36,"props":1323,"children":1324},{"style":80},[1325],{"type":23,"value":419},{"type":17,"tag":36,"props":1327,"children":1328},{"style":105},[1329],{"type":23,"value":1108},{"type":17,"tag":36,"props":1331,"children":1332},{"style":80},[1333],{"type":23,"value":430},{"type":17,"tag":36,"props":1335,"children":1336},{"class":38,"line":115},[1337],{"type":17,"tag":36,"props":1338,"children":1339},{"emptyLinePlaceholder":617},[1340],{"type":23,"value":620},{"type":17,"tag":36,"props":1342,"children":1343},{"class":38,"line":133},[1344,1349,1354,1359,1364,1368],{"type":17,"tag":36,"props":1345,"children":1346},{"style":411},[1347],{"type":23,"value":1348},"watch",{"type":17,"tag":36,"props":1350,"children":1351},{"style":80},[1352],{"type":23,"value":1353},"(todoId, ",{"type":17,"tag":36,"props":1355,"children":1356},{"style":395},[1357],{"type":23,"value":1358},"async",{"type":17,"tag":36,"props":1360,"children":1361},{"style":80},[1362],{"type":23,"value":1363}," () ",{"type":17,"tag":36,"props":1365,"children":1366},{"style":395},[1367],{"type":23,"value":1138},{"type":17,"tag":36,"props":1369,"children":1370},{"style":80},[1371],{"type":23,"value":94},{"type":17,"tag":36,"props":1373,"children":1374},{"class":38,"line":157},[1375,1379,1384,1388,1393,1398],{"type":17,"tag":36,"props":1376,"children":1377},{"style":395},[1378],{"type":23,"value":551},{"type":17,"tag":36,"props":1380,"children":1381},{"style":105},[1382],{"type":23,"value":1383}," response",{"type":17,"tag":36,"props":1385,"children":1386},{"style":395},[1387],{"type":23,"value":408},{"type":17,"tag":36,"props":1389,"children":1390},{"style":395},[1391],{"type":23,"value":1392}," await",{"type":17,"tag":36,"props":1394,"children":1395},{"style":411},[1396],{"type":23,"value":1397}," fetch",{"type":17,"tag":36,"props":1399,"children":1400},{"style":80},[1401],{"type":23,"value":1402},"(\n",{"type":17,"tag":36,"props":1404,"children":1405},{"class":38,"line":180},[1406,1411,1416,1421,1426],{"type":17,"tag":36,"props":1407,"children":1408},{"style":422},[1409],{"type":23,"value":1410}," `https:\u002F\u002Fjsonplaceholder.typicode.com\u002Ftodos\u002F${",{"type":17,"tag":36,"props":1412,"children":1413},{"style":80},[1414],{"type":23,"value":1415},"todoId",{"type":17,"tag":36,"props":1417,"children":1418},{"style":422},[1419],{"type":23,"value":1420},".",{"type":17,"tag":36,"props":1422,"children":1423},{"style":80},[1424],{"type":23,"value":1425},"value",{"type":17,"tag":36,"props":1427,"children":1428},{"style":422},[1429],{"type":23,"value":1430},"}`\n",{"type":17,"tag":36,"props":1432,"children":1433},{"class":38,"line":202},[1434],{"type":17,"tag":36,"props":1435,"children":1436},{"style":80},[1437],{"type":23,"value":1438}," )\n",{"type":17,"tag":36,"props":1440,"children":1441},{"class":38,"line":224},[1442,1447,1451,1455,1460,1465],{"type":17,"tag":36,"props":1443,"children":1444},{"style":80},[1445],{"type":23,"value":1446}," data.value ",{"type":17,"tag":36,"props":1448,"children":1449},{"style":395},[1450],{"type":23,"value":482},{"type":17,"tag":36,"props":1452,"children":1453},{"style":395},[1454],{"type":23,"value":1392},{"type":17,"tag":36,"props":1456,"children":1457},{"style":80},[1458],{"type":23,"value":1459}," response.",{"type":17,"tag":36,"props":1461,"children":1462},{"style":411},[1463],{"type":23,"value":1464},"json",{"type":17,"tag":36,"props":1466,"children":1467},{"style":80},[1468],{"type":23,"value":1160},{"type":17,"tag":36,"props":1470,"children":1471},{"class":38,"line":246},[1472,1477,1482],{"type":17,"tag":36,"props":1473,"children":1474},{"style":80},[1475],{"type":23,"value":1476},"}, { immediate: ",{"type":17,"tag":36,"props":1478,"children":1479},{"style":105},[1480],{"type":23,"value":1481},"true",{"type":17,"tag":36,"props":1483,"children":1484},{"style":80},[1485],{"type":23,"value":1486}," })\n",{"type":17,"tag":323,"props":1488,"children":1489},{},[1490],{"type":23,"value":1491},"使用watchEffect，会自动追踪依赖项，天生拥有immediate属性",{"type":17,"tag":25,"props":1493,"children":1495},{"className":383,"code":1494,"language":385,"meta":7,"style":7},"watchEffect(async () => {\n const response = await fetch(\n `https:\u002F\u002Fjsonplaceholder.typicode.com\u002Ftodos\u002F${todoId.value}`\n )\n data.value = await response.json()\n})\n",[1496],{"type":17,"tag":32,"props":1497,"children":1498},{"__ignoreMap":7},[1499,1526,1553,1576,1583,1610],{"type":17,"tag":36,"props":1500,"children":1501},{"class":38,"line":39},[1502,1506,1510,1514,1518,1522],{"type":17,"tag":36,"props":1503,"children":1504},{"style":411},[1505],{"type":23,"value":1256},{"type":17,"tag":36,"props":1507,"children":1508},{"style":80},[1509],{"type":23,"value":419},{"type":17,"tag":36,"props":1511,"children":1512},{"style":395},[1513],{"type":23,"value":1358},{"type":17,"tag":36,"props":1515,"children":1516},{"style":80},[1517],{"type":23,"value":1363},{"type":17,"tag":36,"props":1519,"children":1520},{"style":395},[1521],{"type":23,"value":1138},{"type":17,"tag":36,"props":1523,"children":1524},{"style":80},[1525],{"type":23,"value":94},{"type":17,"tag":36,"props":1527,"children":1528},{"class":38,"line":48},[1529,1533,1537,1541,1545,1549],{"type":17,"tag":36,"props":1530,"children":1531},{"style":395},[1532],{"type":23,"value":551},{"type":17,"tag":36,"props":1534,"children":1535},{"style":105},[1536],{"type":23,"value":1383},{"type":17,"tag":36,"props":1538,"children":1539},{"style":395},[1540],{"type":23,"value":408},{"type":17,"tag":36,"props":1542,"children":1543},{"style":395},[1544],{"type":23,"value":1392},{"type":17,"tag":36,"props":1546,"children":1547},{"style":411},[1548],{"type":23,"value":1397},{"type":17,"tag":36,"props":1550,"children":1551},{"style":80},[1552],{"type":23,"value":1402},{"type":17,"tag":36,"props":1554,"children":1555},{"class":38,"line":115},[1556,1560,1564,1568,1572],{"type":17,"tag":36,"props":1557,"children":1558},{"style":422},[1559],{"type":23,"value":1410},{"type":17,"tag":36,"props":1561,"children":1562},{"style":80},[1563],{"type":23,"value":1415},{"type":17,"tag":36,"props":1565,"children":1566},{"style":422},[1567],{"type":23,"value":1420},{"type":17,"tag":36,"props":1569,"children":1570},{"style":80},[1571],{"type":23,"value":1425},{"type":17,"tag":36,"props":1573,"children":1574},{"style":422},[1575],{"type":23,"value":1430},{"type":17,"tag":36,"props":1577,"children":1578},{"class":38,"line":133},[1579],{"type":17,"tag":36,"props":1580,"children":1581},{"style":80},[1582],{"type":23,"value":1438},{"type":17,"tag":36,"props":1584,"children":1585},{"class":38,"line":157},[1586,1590,1594,1598,1602,1606],{"type":17,"tag":36,"props":1587,"children":1588},{"style":80},[1589],{"type":23,"value":1446},{"type":17,"tag":36,"props":1591,"children":1592},{"style":395},[1593],{"type":23,"value":482},{"type":17,"tag":36,"props":1595,"children":1596},{"style":395},[1597],{"type":23,"value":1392},{"type":17,"tag":36,"props":1599,"children":1600},{"style":80},[1601],{"type":23,"value":1459},{"type":17,"tag":36,"props":1603,"children":1604},{"style":411},[1605],{"type":23,"value":1464},{"type":17,"tag":36,"props":1607,"children":1608},{"style":80},[1609],{"type":23,"value":1160},{"type":17,"tag":36,"props":1611,"children":1612},{"class":38,"line":180},[1613],{"type":17,"tag":36,"props":1614,"children":1615},{"style":80},[1616],{"type":23,"value":1617},"})\n",{"type":17,"tag":304,"props":1619,"children":1621},{"id":1620},"v-if与v-for",[1622],{"type":23,"value":1620},{"type":17,"tag":323,"props":1624,"children":1625},{},[1626],{"type":23,"value":1627},"vue3中v-if比v-for优先级高",{"type":17,"tag":304,"props":1629,"children":1631},{"id":1630},"类与样式绑定",[1632],{"type":23,"value":1630},{"type":17,"tag":323,"props":1634,"children":1635},{},[1636],{"type":17,"tag":1637,"props":1638,"children":1639},"strong",{},[1640],{"type":23,"value":1641},"最佳实践：使用数组，需要条件判断属性名的时候，在数组中嵌套对象，可以结合计算计算属性使用",{"type":17,"tag":25,"props":1643,"children":1647},{"className":1644,"code":1645,"language":1646,"meta":7,"style":7},"language-html shiki shiki-themes github-dark","\u003Cdiv :class=\"[{ active: isActive }, errorClass]\">\u003C\u002Fdiv>\n","html",[1648],{"type":17,"tag":32,"props":1649,"children":1650},{"__ignoreMap":7},[1651],{"type":17,"tag":36,"props":1652,"children":1653},{"class":38,"line":39},[1654,1658,1662,1667,1671,1676,1681,1685],{"type":17,"tag":36,"props":1655,"children":1656},{"style":80},[1657],{"type":23,"value":528},{"type":17,"tag":36,"props":1659,"children":1660},{"style":86},[1661],{"type":23,"value":794},{"type":17,"tag":36,"props":1663,"children":1664},{"style":411},[1665],{"type":23,"value":1666}," :class",{"type":17,"tag":36,"props":1668,"children":1669},{"style":80},[1670],{"type":23,"value":482},{"type":17,"tag":36,"props":1672,"children":1673},{"style":422},[1674],{"type":23,"value":1675},"\"[{ active: isActive }, errorClass]\"",{"type":17,"tag":36,"props":1677,"children":1678},{"style":80},[1679],{"type":23,"value":1680},">\u003C\u002F",{"type":17,"tag":36,"props":1682,"children":1683},{"style":86},[1684],{"type":23,"value":794},{"type":17,"tag":36,"props":1686,"children":1687},{"style":80},[1688],{"type":23,"value":543},{"type":17,"tag":304,"props":1690,"children":1692},{"id":1691},"计算属性",[1693],{"type":23,"value":1691},{"type":17,"tag":1695,"props":1696,"children":1697},"ol",{},[1698],{"type":17,"tag":1699,"props":1700,"children":1701},"li",{},[1702],{"type":23,"value":1703},"不要在计算属性中修改原数据",{"type":17,"tag":304,"props":1705,"children":1707},{"id":1706},"强制视图刷新",[1708],{"type":23,"value":1706},{"type":17,"tag":323,"props":1710,"children":1711},{},[1712],{"type":17,"tag":1637,"props":1713,"children":1714},{},[1715],{"type":23,"value":1716},"vue2：",{"type":17,"tag":25,"props":1718,"children":1720},{"className":383,"code":1719,"language":385,"meta":7,"style":7},"this.$forceUpdate();\n",[1721],{"type":17,"tag":32,"props":1722,"children":1723},{"__ignoreMap":7},[1724],{"type":17,"tag":36,"props":1725,"children":1726},{"class":38,"line":39},[1727,1732,1736,1741],{"type":17,"tag":36,"props":1728,"children":1729},{"style":105},[1730],{"type":23,"value":1731},"this",{"type":17,"tag":36,"props":1733,"children":1734},{"style":80},[1735],{"type":23,"value":1420},{"type":17,"tag":36,"props":1737,"children":1738},{"style":411},[1739],{"type":23,"value":1740},"$forceUpdate",{"type":17,"tag":36,"props":1742,"children":1743},{"style":80},[1744],{"type":23,"value":1745},"();\n",{"type":17,"tag":323,"props":1747,"children":1748},{},[1749],{"type":17,"tag":1637,"props":1750,"children":1751},{},[1752],{"type":23,"value":1753},"vue3：",{"type":17,"tag":25,"props":1755,"children":1757},{"className":383,"code":1756,"language":385,"meta":7,"style":7},"import { getCurrentInstance, ComponentInternalInstance } from \"vue\";\nsetup(){\n\u002F\u002F解构赋值 设置别名that 也可不写 :that 直接ctx\n\u002F\u002Fctx 得到普通对象\n\u002F\u002Fproxy得到响应式对象\n\u002F\u002F 推荐使用第二种proxy 严谨写法\n\u002F\u002F 第一种写法\n let {ctx:that, proxy}:any = getCurrentInstance()\n that.$forceUpdate()\n \n\u002F\u002F 第二种写法\n const { proxy } = getCurrentInstance() as ComponentInternalInstance\n proxy!.$forceUpdate()\n}\n",[1758],{"type":17,"tag":32,"props":1759,"children":1760},{"__ignoreMap":7},[1761,1787,1800,1809,1817,1825,1833,1841,1888,1904,1911,1919,1965,1990],{"type":17,"tag":36,"props":1762,"children":1763},{"class":38,"line":39},[1764,1769,1774,1778,1783],{"type":17,"tag":36,"props":1765,"children":1766},{"style":395},[1767],{"type":23,"value":1768},"import",{"type":17,"tag":36,"props":1770,"children":1771},{"style":80},[1772],{"type":23,"value":1773}," { getCurrentInstance, ComponentInternalInstance } ",{"type":17,"tag":36,"props":1775,"children":1776},{"style":395},[1777],{"type":23,"value":1047},{"type":17,"tag":36,"props":1779,"children":1780},{"style":422},[1781],{"type":23,"value":1782}," \"vue\"",{"type":17,"tag":36,"props":1784,"children":1785},{"style":80},[1786],{"type":23,"value":177},{"type":17,"tag":36,"props":1788,"children":1789},{"class":38,"line":48},[1790,1795],{"type":17,"tag":36,"props":1791,"children":1792},{"style":411},[1793],{"type":23,"value":1794},"setup",{"type":17,"tag":36,"props":1796,"children":1797},{"style":80},[1798],{"type":23,"value":1799},"(){\n",{"type":17,"tag":36,"props":1801,"children":1802},{"class":38,"line":115},[1803],{"type":17,"tag":36,"props":1804,"children":1806},{"style":1805},"--shiki-default:#6A737D",[1807],{"type":23,"value":1808},"\u002F\u002F解构赋值 设置别名that 也可不写 :that 直接ctx\n",{"type":17,"tag":36,"props":1810,"children":1811},{"class":38,"line":133},[1812],{"type":17,"tag":36,"props":1813,"children":1814},{"style":1805},[1815],{"type":23,"value":1816},"\u002F\u002Fctx 得到普通对象\n",{"type":17,"tag":36,"props":1818,"children":1819},{"class":38,"line":157},[1820],{"type":17,"tag":36,"props":1821,"children":1822},{"style":1805},[1823],{"type":23,"value":1824},"\u002F\u002Fproxy得到响应式对象\n",{"type":17,"tag":36,"props":1826,"children":1827},{"class":38,"line":180},[1828],{"type":17,"tag":36,"props":1829,"children":1830},{"style":1805},[1831],{"type":23,"value":1832},"\u002F\u002F 推荐使用第二种proxy 严谨写法\n",{"type":17,"tag":36,"props":1834,"children":1835},{"class":38,"line":202},[1836],{"type":17,"tag":36,"props":1837,"children":1838},{"style":1805},[1839],{"type":23,"value":1840},"\u002F\u002F 第一种写法\n",{"type":17,"tag":36,"props":1842,"children":1843},{"class":38,"line":224},[1844,1849,1854,1860,1865,1870,1875,1879,1884],{"type":17,"tag":36,"props":1845,"children":1846},{"style":395},[1847],{"type":23,"value":1848}," let",{"type":17,"tag":36,"props":1850,"children":1851},{"style":80},[1852],{"type":23,"value":1853}," {",{"type":17,"tag":36,"props":1855,"children":1857},{"style":1856},"--shiki-default:#FFAB70",[1858],{"type":23,"value":1859},"ctx",{"type":17,"tag":36,"props":1861,"children":1862},{"style":80},[1863],{"type":23,"value":1864},":that, proxy}",{"type":17,"tag":36,"props":1866,"children":1867},{"style":395},[1868],{"type":23,"value":1869},":",{"type":17,"tag":36,"props":1871,"children":1872},{"style":105},[1873],{"type":23,"value":1874},"any",{"type":17,"tag":36,"props":1876,"children":1877},{"style":395},[1878],{"type":23,"value":408},{"type":17,"tag":36,"props":1880,"children":1881},{"style":411},[1882],{"type":23,"value":1883}," getCurrentInstance",{"type":17,"tag":36,"props":1885,"children":1886},{"style":80},[1887],{"type":23,"value":1160},{"type":17,"tag":36,"props":1889,"children":1890},{"class":38,"line":246},[1891,1896,1900],{"type":17,"tag":36,"props":1892,"children":1893},{"style":80},[1894],{"type":23,"value":1895}," that.",{"type":17,"tag":36,"props":1897,"children":1898},{"style":411},[1899],{"type":23,"value":1740},{"type":17,"tag":36,"props":1901,"children":1902},{"style":80},[1903],{"type":23,"value":1160},{"type":17,"tag":36,"props":1905,"children":1906},{"class":38,"line":267},[1907],{"type":17,"tag":36,"props":1908,"children":1909},{"style":80},[1910],{"type":23,"value":1120},{"type":17,"tag":36,"props":1912,"children":1913},{"class":38,"line":276},[1914],{"type":17,"tag":36,"props":1915,"children":1916},{"style":1805},[1917],{"type":23,"value":1918},"\u002F\u002F 第二种写法\n",{"type":17,"tag":36,"props":1920,"children":1921},{"class":38,"line":285},[1922,1927,1932,1937,1942,1946,1950,1955,1960],{"type":17,"tag":36,"props":1923,"children":1924},{"style":395},[1925],{"type":23,"value":1926}," const",{"type":17,"tag":36,"props":1928,"children":1929},{"style":80},[1930],{"type":23,"value":1931}," { ",{"type":17,"tag":36,"props":1933,"children":1934},{"style":105},[1935],{"type":23,"value":1936},"proxy",{"type":17,"tag":36,"props":1938,"children":1939},{"style":80},[1940],{"type":23,"value":1941}," } ",{"type":17,"tag":36,"props":1943,"children":1944},{"style":395},[1945],{"type":23,"value":482},{"type":17,"tag":36,"props":1947,"children":1948},{"style":411},[1949],{"type":23,"value":1883},{"type":17,"tag":36,"props":1951,"children":1952},{"style":80},[1953],{"type":23,"value":1954},"() ",{"type":17,"tag":36,"props":1956,"children":1957},{"style":395},[1958],{"type":23,"value":1959},"as",{"type":17,"tag":36,"props":1961,"children":1962},{"style":411},[1963],{"type":23,"value":1964}," ComponentInternalInstance\n",{"type":17,"tag":36,"props":1966,"children":1967},{"class":38,"line":815},[1968,1973,1978,1982,1986],{"type":17,"tag":36,"props":1969,"children":1970},{"style":80},[1971],{"type":23,"value":1972}," proxy",{"type":17,"tag":36,"props":1974,"children":1975},{"style":395},[1976],{"type":23,"value":1977},"!",{"type":17,"tag":36,"props":1979,"children":1980},{"style":80},[1981],{"type":23,"value":1420},{"type":17,"tag":36,"props":1983,"children":1984},{"style":411},[1985],{"type":23,"value":1740},{"type":17,"tag":36,"props":1987,"children":1988},{"style":80},[1989],{"type":23,"value":1160},{"type":17,"tag":36,"props":1991,"children":1992},{"class":38,"line":954},[1993],{"type":17,"tag":36,"props":1994,"children":1995},{"style":80},[1996],{"type":23,"value":291},{"type":17,"tag":304,"props":1998,"children":2000},{"id":1999},"reactive的局限性",[2001],{"type":23,"value":2002},"reactive()的局限性",{"type":17,"tag":1695,"props":2004,"children":2005},{},[2006,2011],{"type":17,"tag":1699,"props":2007,"children":2008},{},[2009],{"type":23,"value":2010},"只能用于对象、数组、Map、Set这样的集合类型，不能用于原始类型",{"type":17,"tag":1699,"props":2012,"children":2013},{},[2014],{"type":23,"value":2015},"不能替换整个对象",{"type":17,"tag":25,"props":2017,"children":2019},{"className":383,"code":2018,"language":385,"meta":7,"style":7},"let state = reactive({ count: 0 })\n\n\u002F\u002F 上面的 ({ count: 0 }) 引用将不再被追踪\n\u002F\u002F 响应性连接已丢失！\nstate = reactive({ count: 1 })\n",[2020],{"type":17,"tag":32,"props":2021,"children":2022},{"__ignoreMap":7},[2023,2057,2064,2072,2080],{"type":17,"tag":36,"props":2024,"children":2025},{"class":38,"line":39},[2026,2030,2035,2039,2044,2049,2053],{"type":17,"tag":36,"props":2027,"children":2028},{"style":395},[2029],{"type":23,"value":472},{"type":17,"tag":36,"props":2031,"children":2032},{"style":80},[2033],{"type":23,"value":2034}," state ",{"type":17,"tag":36,"props":2036,"children":2037},{"style":395},[2038],{"type":23,"value":482},{"type":17,"tag":36,"props":2040,"children":2041},{"style":411},[2042],{"type":23,"value":2043}," reactive",{"type":17,"tag":36,"props":2045,"children":2046},{"style":80},[2047],{"type":23,"value":2048},"({ count: ",{"type":17,"tag":36,"props":2050,"children":2051},{"style":105},[2052],{"type":23,"value":217},{"type":17,"tag":36,"props":2054,"children":2055},{"style":80},[2056],{"type":23,"value":1486},{"type":17,"tag":36,"props":2058,"children":2059},{"class":38,"line":48},[2060],{"type":17,"tag":36,"props":2061,"children":2062},{"emptyLinePlaceholder":617},[2063],{"type":23,"value":620},{"type":17,"tag":36,"props":2065,"children":2066},{"class":38,"line":115},[2067],{"type":17,"tag":36,"props":2068,"children":2069},{"style":1805},[2070],{"type":23,"value":2071},"\u002F\u002F 上面的 ({ count: 0 }) 引用将不再被追踪\n",{"type":17,"tag":36,"props":2073,"children":2074},{"class":38,"line":133},[2075],{"type":17,"tag":36,"props":2076,"children":2077},{"style":1805},[2078],{"type":23,"value":2079},"\u002F\u002F 响应性连接已丢失！\n",{"type":17,"tag":36,"props":2081,"children":2082},{"class":38,"line":157},[2083,2088,2092,2096,2100,2104],{"type":17,"tag":36,"props":2084,"children":2085},{"style":80},[2086],{"type":23,"value":2087},"state ",{"type":17,"tag":36,"props":2089,"children":2090},{"style":395},[2091],{"type":23,"value":482},{"type":17,"tag":36,"props":2093,"children":2094},{"style":411},[2095],{"type":23,"value":2043},{"type":17,"tag":36,"props":2097,"children":2098},{"style":80},[2099],{"type":23,"value":2048},{"type":17,"tag":36,"props":2101,"children":2102},{"style":105},[2103],{"type":23,"value":1297},{"type":17,"tag":36,"props":2105,"children":2106},{"style":80},[2107],{"type":23,"value":1486},{"type":17,"tag":1695,"props":2109,"children":2110},{"start":115},[2111],{"type":17,"tag":1699,"props":2112,"children":2113},{},[2114],{"type":23,"value":2115},"解构之后会失去响应式",{"type":17,"tag":25,"props":2117,"children":2119},{"className":383,"code":2118,"language":385,"meta":7,"style":7},"const state = reactive({ count: 0 })\n\n\u002F\u002F 当解构时，count 已经与 state.count 断开连接\nlet { count } = state\n\u002F\u002F 不会影响原始的 state\ncount++\n\n\u002F\u002F 该函数接收到的是一个普通的数字\n\u002F\u002F 并且无法追踪 state.count 的变化\n\u002F\u002F 我们必须传入整个对象以保持响应性\ncallSomeFunction(state.count)\n",[2120],{"type":17,"tag":32,"props":2121,"children":2122},{"__ignoreMap":7},[2123,2155,2162,2170,2191,2199,2212,2219,2227,2235,2243],{"type":17,"tag":36,"props":2124,"children":2125},{"class":38,"line":39},[2126,2130,2135,2139,2143,2147,2151],{"type":17,"tag":36,"props":2127,"children":2128},{"style":395},[2129],{"type":23,"value":398},{"type":17,"tag":36,"props":2131,"children":2132},{"style":105},[2133],{"type":23,"value":2134}," state",{"type":17,"tag":36,"props":2136,"children":2137},{"style":395},[2138],{"type":23,"value":408},{"type":17,"tag":36,"props":2140,"children":2141},{"style":411},[2142],{"type":23,"value":2043},{"type":17,"tag":36,"props":2144,"children":2145},{"style":80},[2146],{"type":23,"value":2048},{"type":17,"tag":36,"props":2148,"children":2149},{"style":105},[2150],{"type":23,"value":217},{"type":17,"tag":36,"props":2152,"children":2153},{"style":80},[2154],{"type":23,"value":1486},{"type":17,"tag":36,"props":2156,"children":2157},{"class":38,"line":48},[2158],{"type":17,"tag":36,"props":2159,"children":2160},{"emptyLinePlaceholder":617},[2161],{"type":23,"value":620},{"type":17,"tag":36,"props":2163,"children":2164},{"class":38,"line":115},[2165],{"type":17,"tag":36,"props":2166,"children":2167},{"style":1805},[2168],{"type":23,"value":2169},"\u002F\u002F 当解构时，count 已经与 state.count 断开连接\n",{"type":17,"tag":36,"props":2171,"children":2172},{"class":38,"line":133},[2173,2177,2182,2186],{"type":17,"tag":36,"props":2174,"children":2175},{"style":395},[2176],{"type":23,"value":472},{"type":17,"tag":36,"props":2178,"children":2179},{"style":80},[2180],{"type":23,"value":2181}," { count } ",{"type":17,"tag":36,"props":2183,"children":2184},{"style":395},[2185],{"type":23,"value":482},{"type":17,"tag":36,"props":2187,"children":2188},{"style":80},[2189],{"type":23,"value":2190}," state\n",{"type":17,"tag":36,"props":2192,"children":2193},{"class":38,"line":157},[2194],{"type":17,"tag":36,"props":2195,"children":2196},{"style":1805},[2197],{"type":23,"value":2198},"\u002F\u002F 不会影响原始的 state\n",{"type":17,"tag":36,"props":2200,"children":2201},{"class":38,"line":180},[2202,2207],{"type":17,"tag":36,"props":2203,"children":2204},{"style":80},[2205],{"type":23,"value":2206},"count",{"type":17,"tag":36,"props":2208,"children":2209},{"style":395},[2210],{"type":23,"value":2211},"++\n",{"type":17,"tag":36,"props":2213,"children":2214},{"class":38,"line":202},[2215],{"type":17,"tag":36,"props":2216,"children":2217},{"emptyLinePlaceholder":617},[2218],{"type":23,"value":620},{"type":17,"tag":36,"props":2220,"children":2221},{"class":38,"line":224},[2222],{"type":17,"tag":36,"props":2223,"children":2224},{"style":1805},[2225],{"type":23,"value":2226},"\u002F\u002F 该函数接收到的是一个普通的数字\n",{"type":17,"tag":36,"props":2228,"children":2229},{"class":38,"line":246},[2230],{"type":17,"tag":36,"props":2231,"children":2232},{"style":1805},[2233],{"type":23,"value":2234},"\u002F\u002F 并且无法追踪 state.count 的变化\n",{"type":17,"tag":36,"props":2236,"children":2237},{"class":38,"line":267},[2238],{"type":17,"tag":36,"props":2239,"children":2240},{"style":1805},[2241],{"type":23,"value":2242},"\u002F\u002F 我们必须传入整个对象以保持响应性\n",{"type":17,"tag":36,"props":2244,"children":2245},{"class":38,"line":276},[2246,2251],{"type":17,"tag":36,"props":2247,"children":2248},{"style":411},[2249],{"type":23,"value":2250},"callSomeFunction",{"type":17,"tag":36,"props":2252,"children":2253},{"style":80},[2254],{"type":23,"value":2255},"(state.count)\n",{"type":17,"tag":304,"props":2257,"children":2259},{"id":2258},"样式穿透-1",[2260],{"type":23,"value":63},{"type":17,"tag":25,"props":2262,"children":2264},{"className":68,"code":2263,"language":70,"meta":7,"style":7},":deep(.el-input__wrapper) {\n background-color: #07172e;\n}\n",[2265],{"type":17,"tag":32,"props":2266,"children":2267},{"__ignoreMap":7},[2268,2286,2307],{"type":17,"tag":36,"props":2269,"children":2270},{"class":38,"line":39},[2271,2276,2281],{"type":17,"tag":36,"props":2272,"children":2273},{"style":80},[2274],{"type":23,"value":2275},":deep(",{"type":17,"tag":36,"props":2277,"children":2278},{"style":411},[2279],{"type":23,"value":2280},".el-input__wrapper",{"type":17,"tag":36,"props":2282,"children":2283},{"style":80},[2284],{"type":23,"value":2285},") {\n",{"type":17,"tag":36,"props":2287,"children":2288},{"class":38,"line":48},[2289,2294,2298,2303],{"type":17,"tag":36,"props":2290,"children":2291},{"style":105},[2292],{"type":23,"value":2293}," background-color",{"type":17,"tag":36,"props":2295,"children":2296},{"style":80},[2297],{"type":23,"value":144},{"type":17,"tag":36,"props":2299,"children":2300},{"style":105},[2301],{"type":23,"value":2302},"#07172e",{"type":17,"tag":36,"props":2304,"children":2305},{"style":80},[2306],{"type":23,"value":177},{"type":17,"tag":36,"props":2308,"children":2309},{"class":38,"line":115},[2310],{"type":17,"tag":36,"props":2311,"children":2312},{"style":80},[2313],{"type":23,"value":291},{"type":17,"tag":304,"props":2315,"children":2317},{"id":2316},"静态资源-v-bind",[2318],{"type":23,"value":2319},"静态资源 + v-bind",{"type":17,"tag":25,"props":2321,"children":2323},{"className":339,"code":2322,"language":341,"meta":7,"style":7},"improt logo from \"@\u002Fassets\u002Flogo.png\"\n\n\u003Cimg :src=\"logo\" \u002F>\n",[2324],{"type":17,"tag":32,"props":2325,"children":2326},{"__ignoreMap":7},[2327,2335,2342],{"type":17,"tag":36,"props":2328,"children":2329},{"class":38,"line":39},[2330],{"type":17,"tag":36,"props":2331,"children":2332},{"style":80},[2333],{"type":23,"value":2334},"improt logo from \"@\u002Fassets\u002Flogo.png\"\n",{"type":17,"tag":36,"props":2336,"children":2337},{"class":38,"line":48},[2338],{"type":17,"tag":36,"props":2339,"children":2340},{"emptyLinePlaceholder":617},[2341],{"type":23,"value":620},{"type":17,"tag":36,"props":2343,"children":2344},{"class":38,"line":115},[2345,2349,2354,2358,2363,2367,2371,2376,2380],{"type":17,"tag":36,"props":2346,"children":2347},{"style":80},[2348],{"type":23,"value":528},{"type":17,"tag":36,"props":2350,"children":2351},{"style":86},[2352],{"type":23,"value":2353},"img",{"type":17,"tag":36,"props":2355,"children":2356},{"style":80},[2357],{"type":23,"value":680},{"type":17,"tag":36,"props":2359,"children":2360},{"style":411},[2361],{"type":23,"value":2362},"src",{"type":17,"tag":36,"props":2364,"children":2365},{"style":80},[2366],{"type":23,"value":482},{"type":17,"tag":36,"props":2368,"children":2369},{"style":422},[2370],{"type":23,"value":842},{"type":17,"tag":36,"props":2372,"children":2373},{"style":80},[2374],{"type":23,"value":2375},"logo",{"type":17,"tag":36,"props":2377,"children":2378},{"style":422},[2379],{"type":23,"value":842},{"type":17,"tag":36,"props":2381,"children":2382},{"style":80},[2383],{"type":23,"value":1235},{"type":17,"tag":61,"props":2385,"children":2387},{"id":2386},"选项式api",[2388],{"type":23,"value":2389},"选项式API",{"type":17,"tag":304,"props":2391,"children":2393},{"id":2392},"计算属性与监听器",[2394],{"type":23,"value":2392},{"type":17,"tag":2396,"props":2397,"children":2398},"ul",{},[2399,2404],{"type":17,"tag":1699,"props":2400,"children":2401},{},[2402],{"type":23,"value":2403},"计算属性适合多个值影响一个值；监听器适合一个值影响多个值",{"type":17,"tag":1699,"props":2405,"children":2406},{},[2407],{"type":23,"value":2408},"计算属性不支持异步程序；监听器支持异步程序",{"type":17,"tag":304,"props":2410,"children":2412},{"id":2411},"类名与行内样式",[2413],{"type":23,"value":2411},{"type":17,"tag":2396,"props":2415,"children":2416},{},[2417],{"type":17,"tag":1699,"props":2418,"children":2419},{},[2420,2422,2428],{"type":23,"value":2421},"可以使用动态绑定",{"type":17,"tag":32,"props":2423,"children":2425},{"className":2424},[],[2426],{"type":23,"value":2427},"v-bind:",{"type":23,"value":2429}," + 字符串、数组、对象的方式设置样式",{"type":17,"tag":304,"props":2431,"children":2433},{"id":2432},"双向数据绑定",[2434],{"type":23,"value":2432},{"type":17,"tag":2396,"props":2436,"children":2437},{},[2438],{"type":17,"tag":1699,"props":2439,"children":2440},{},[2441],{"type":23,"value":2442},"通过动态绑定与事件绑定实现",{"type":17,"tag":25,"props":2444,"children":2446},{"className":1644,"code":2445,"language":1646,"meta":7,"style":7},"\u003Cimput type=\"text\" :value=\"message\" @input=\"message = $event.target.value\">\n",[2447],{"type":17,"tag":32,"props":2448,"children":2449},{"__ignoreMap":7},[2450],{"type":17,"tag":36,"props":2451,"children":2452},{"class":38,"line":39},[2453,2457,2463,2468,2472,2477,2482,2486,2491,2496,2500,2505],{"type":17,"tag":36,"props":2454,"children":2455},{"style":80},[2456],{"type":23,"value":528},{"type":17,"tag":36,"props":2458,"children":2460},{"style":2459},"--shiki-default:#FDAEB7;--shiki-default-font-style:italic",[2461],{"type":23,"value":2462},"imput",{"type":17,"tag":36,"props":2464,"children":2465},{"style":411},[2466],{"type":23,"value":2467}," type",{"type":17,"tag":36,"props":2469,"children":2470},{"style":80},[2471],{"type":23,"value":482},{"type":17,"tag":36,"props":2473,"children":2474},{"style":422},[2475],{"type":23,"value":2476},"\"text\"",{"type":17,"tag":36,"props":2478,"children":2479},{"style":411},[2480],{"type":23,"value":2481}," :value",{"type":17,"tag":36,"props":2483,"children":2484},{"style":80},[2485],{"type":23,"value":482},{"type":17,"tag":36,"props":2487,"children":2488},{"style":422},[2489],{"type":23,"value":2490},"\"message\"",{"type":17,"tag":36,"props":2492,"children":2493},{"style":411},[2494],{"type":23,"value":2495}," @input",{"type":17,"tag":36,"props":2497,"children":2498},{"style":80},[2499],{"type":23,"value":482},{"type":17,"tag":36,"props":2501,"children":2502},{"style":422},[2503],{"type":23,"value":2504},"\"message = $event.target.value\"",{"type":17,"tag":36,"props":2506,"children":2507},{"style":80},[2508],{"type":23,"value":543},{"type":17,"tag":2396,"props":2510,"children":2511},{},[2512],{"type":17,"tag":1699,"props":2513,"children":2514},{},[2515],{"type":23,"value":2516},"输入框、多选框、单选框都可以双向数据绑定显示数据",{"type":17,"tag":304,"props":2518,"children":2520},{"id":2519},"生命周期钩子",[2521],{"type":23,"value":2519},{"type":17,"tag":2396,"props":2523,"children":2524},{},[2525,2538,2557],{"type":17,"tag":1699,"props":2526,"children":2527},{},[2528,2530,2536],{"type":23,"value":2529},"在",{"type":17,"tag":32,"props":2531,"children":2533},{"className":2532},[],[2534],{"type":23,"value":2535},"create",{"type":23,"value":2537},"钩子中发AJAX请求",{"type":17,"tag":1699,"props":2539,"children":2540},{},[2541,2547,2549,2555],{"type":17,"tag":32,"props":2542,"children":2544},{"className":2543},[],[2545],{"type":23,"value":2546},"beforeUpdate",{"type":23,"value":2548},"：数据更新了，但是DOM没有更新；",{"type":17,"tag":32,"props":2550,"children":2552},{"className":2551},[],[2553],{"type":23,"value":2554},"updated",{"type":23,"value":2556},"：数据和DOM都更新了",{"type":17,"tag":1699,"props":2558,"children":2559},{},[2560,2566,2568,2574],{"type":17,"tag":32,"props":2561,"children":2563},{"className":2562},[],[2564],{"type":23,"value":2565},"beforeUnmount",{"type":23,"value":2567},"：数据和DOM都能访问到；",{"type":17,"tag":32,"props":2569,"children":2571},{"className":2570},[],[2572],{"type":23,"value":2573},"unmount",{"type":23,"value":2575},"：数据能访问，DOM访问不了",{"type":17,"tag":304,"props":2577,"children":2579},{"id":2578},"组件",[2580],{"type":23,"value":2578},{"type":17,"tag":2396,"props":2582,"children":2583},{},[2584,2597],{"type":17,"tag":1699,"props":2585,"children":2586},{},[2587,2589,2595],{"type":23,"value":2588},"可以通过",{"type":17,"tag":32,"props":2590,"children":2592},{"className":2591},[],[2593],{"type":23,"value":2594},"app.component(\"MyComponent\", {...})",{"type":23,"value":2596},"创建组件",{"type":17,"tag":1699,"props":2598,"children":2599},{},[2600,2606,2608,2614],{"type":17,"tag":32,"props":2601,"children":2603},{"className":2602},[],[2604],{"type":23,"value":2605},"this.$attrs",{"type":23,"value":2607}," 、",{"type":17,"tag":32,"props":2609,"children":2611},{"className":2610},[],[2612],{"type":23,"value":2613},"this.$ref",{"type":23,"value":2615},"、自定义属性(父传子)、自定义事件(子传父)等都可以实现组件间通信",{"type":17,"tag":304,"props":2617,"children":2619},{"id":2618},"插槽",[2620],{"type":23,"value":2618},{"type":17,"tag":2396,"props":2622,"children":2623},{},[2624],{"type":17,"tag":1699,"props":2625,"children":2626},{},[2627],{"type":23,"value":2628},"具名插槽",{"type":17,"tag":25,"props":2630,"children":2632},{"className":339,"code":2631,"language":341,"meta":7,"style":7},"\u003Cmy-header>\n \u003Ctemplate #logo>\n \u003Ch2>logo\u003C\u002Fh2>\n \u003C\u002Ftemplate>\n \n \u003Ctemplate #list>\n \u003Cul>\n \u003Cli>JavaScript\u003C\u002Fli>\n \u003Cli>Java\u003C\u002Fli>\n \u003Cli>Golang\u003C\u002Fli>\n \u003Cli>Rust\u003C\u002Fli>\n \u003C\u002Ful>\n \u003C\u002Ftemplate>\n\u003C\u002Fmy-header>\n\n\n\u003Ctemplate>\n \u003Cslot name=\"logo\"\u002F>\n \u003Cslot name=\"list\"\u002F>\n\u003C\u002Ftemplate>\n",[2633],{"type":17,"tag":32,"props":2634,"children":2635},{"__ignoreMap":7},[2636,2652,2660,2668,2676,2683,2691,2699,2707,2715,2723,2731,2739,2746,2761,2768,2776,2792,2828,2861],{"type":17,"tag":36,"props":2637,"children":2638},{"class":38,"line":39},[2639,2643,2648],{"type":17,"tag":36,"props":2640,"children":2641},{"style":80},[2642],{"type":23,"value":528},{"type":17,"tag":36,"props":2644,"children":2645},{"style":86},[2646],{"type":23,"value":2647},"my-header",{"type":17,"tag":36,"props":2649,"children":2650},{"style":80},[2651],{"type":23,"value":543},{"type":17,"tag":36,"props":2653,"children":2654},{"class":38,"line":48},[2655],{"type":17,"tag":36,"props":2656,"children":2657},{"style":80},[2658],{"type":23,"value":2659}," \u003Ctemplate #logo>\n",{"type":17,"tag":36,"props":2661,"children":2662},{"class":38,"line":115},[2663],{"type":17,"tag":36,"props":2664,"children":2665},{"style":80},[2666],{"type":23,"value":2667}," \u003Ch2>logo\u003C\u002Fh2>\n",{"type":17,"tag":36,"props":2669,"children":2670},{"class":38,"line":133},[2671],{"type":17,"tag":36,"props":2672,"children":2673},{"style":80},[2674],{"type":23,"value":2675}," \u003C\u002Ftemplate>\n",{"type":17,"tag":36,"props":2677,"children":2678},{"class":38,"line":157},[2679],{"type":17,"tag":36,"props":2680,"children":2681},{"style":80},[2682],{"type":23,"value":1120},{"type":17,"tag":36,"props":2684,"children":2685},{"class":38,"line":180},[2686],{"type":17,"tag":36,"props":2687,"children":2688},{"style":80},[2689],{"type":23,"value":2690}," \u003Ctemplate #list>\n",{"type":17,"tag":36,"props":2692,"children":2693},{"class":38,"line":202},[2694],{"type":17,"tag":36,"props":2695,"children":2696},{"style":80},[2697],{"type":23,"value":2698}," \u003Cul>\n",{"type":17,"tag":36,"props":2700,"children":2701},{"class":38,"line":224},[2702],{"type":17,"tag":36,"props":2703,"children":2704},{"style":80},[2705],{"type":23,"value":2706}," \u003Cli>JavaScript\u003C\u002Fli>\n",{"type":17,"tag":36,"props":2708,"children":2709},{"class":38,"line":246},[2710],{"type":17,"tag":36,"props":2711,"children":2712},{"style":80},[2713],{"type":23,"value":2714}," \u003Cli>Java\u003C\u002Fli>\n",{"type":17,"tag":36,"props":2716,"children":2717},{"class":38,"line":267},[2718],{"type":17,"tag":36,"props":2719,"children":2720},{"style":80},[2721],{"type":23,"value":2722}," \u003Cli>Golang\u003C\u002Fli>\n",{"type":17,"tag":36,"props":2724,"children":2725},{"class":38,"line":276},[2726],{"type":17,"tag":36,"props":2727,"children":2728},{"style":80},[2729],{"type":23,"value":2730}," \u003Cli>Rust\u003C\u002Fli>\n",{"type":17,"tag":36,"props":2732,"children":2733},{"class":38,"line":285},[2734],{"type":17,"tag":36,"props":2735,"children":2736},{"style":80},[2737],{"type":23,"value":2738}," \u003C\u002Ful>\n",{"type":17,"tag":36,"props":2740,"children":2741},{"class":38,"line":815},[2742],{"type":17,"tag":36,"props":2743,"children":2744},{"style":80},[2745],{"type":23,"value":2675},{"type":17,"tag":36,"props":2747,"children":2748},{"class":38,"line":954},[2749,2753,2757],{"type":17,"tag":36,"props":2750,"children":2751},{"style":80},[2752],{"type":23,"value":750},{"type":17,"tag":36,"props":2754,"children":2755},{"style":86},[2756],{"type":23,"value":2647},{"type":17,"tag":36,"props":2758,"children":2759},{"style":80},[2760],{"type":23,"value":543},{"type":17,"tag":36,"props":2762,"children":2763},{"class":38,"line":971},[2764],{"type":17,"tag":36,"props":2765,"children":2766},{"emptyLinePlaceholder":617},[2767],{"type":23,"value":620},{"type":17,"tag":36,"props":2769,"children":2771},{"class":38,"line":2770},16,[2772],{"type":17,"tag":36,"props":2773,"children":2774},{"emptyLinePlaceholder":617},[2775],{"type":23,"value":620},{"type":17,"tag":36,"props":2777,"children":2779},{"class":38,"line":2778},17,[2780,2784,2788],{"type":17,"tag":36,"props":2781,"children":2782},{"style":80},[2783],{"type":23,"value":528},{"type":17,"tag":36,"props":2785,"children":2786},{"style":86},[2787],{"type":23,"value":777},{"type":17,"tag":36,"props":2789,"children":2790},{"style":80},[2791],{"type":23,"value":543},{"type":17,"tag":36,"props":2793,"children":2795},{"class":38,"line":2794},18,[2796,2800,2805,2810,2814,2819,2824],{"type":17,"tag":36,"props":2797,"children":2798},{"style":80},[2799],{"type":23,"value":821},{"type":17,"tag":36,"props":2801,"children":2802},{"style":86},[2803],{"type":23,"value":2804},"slot",{"type":17,"tag":36,"props":2806,"children":2807},{"style":411},[2808],{"type":23,"value":2809}," name",{"type":17,"tag":36,"props":2811,"children":2812},{"style":80},[2813],{"type":23,"value":482},{"type":17,"tag":36,"props":2815,"children":2816},{"style":422},[2817],{"type":23,"value":2818},"\"logo\"",{"type":17,"tag":36,"props":2820,"children":2821},{"style":2459},[2822],{"type":23,"value":2823},"\u002F",{"type":17,"tag":36,"props":2825,"children":2826},{"style":80},[2827],{"type":23,"value":543},{"type":17,"tag":36,"props":2829,"children":2831},{"class":38,"line":2830},19,[2832,2836,2840,2844,2848,2853,2857],{"type":17,"tag":36,"props":2833,"children":2834},{"style":80},[2835],{"type":23,"value":821},{"type":17,"tag":36,"props":2837,"children":2838},{"style":86},[2839],{"type":23,"value":2804},{"type":17,"tag":36,"props":2841,"children":2842},{"style":411},[2843],{"type":23,"value":2809},{"type":17,"tag":36,"props":2845,"children":2846},{"style":80},[2847],{"type":23,"value":482},{"type":17,"tag":36,"props":2849,"children":2850},{"style":422},[2851],{"type":23,"value":2852},"\"list\"",{"type":17,"tag":36,"props":2854,"children":2855},{"style":2459},[2856],{"type":23,"value":2823},{"type":17,"tag":36,"props":2858,"children":2859},{"style":80},[2860],{"type":23,"value":543},{"type":17,"tag":36,"props":2862,"children":2864},{"class":38,"line":2863},20,[2865,2869,2873],{"type":17,"tag":36,"props":2866,"children":2867},{"style":80},[2868],{"type":23,"value":750},{"type":17,"tag":36,"props":2870,"children":2871},{"style":86},[2872],{"type":23,"value":777},{"type":17,"tag":36,"props":2874,"children":2875},{"style":80},[2876],{"type":23,"value":543},{"type":17,"tag":2396,"props":2878,"children":2879},{},[2880],{"type":17,"tag":1699,"props":2881,"children":2882},{},[2883],{"type":23,"value":2884},"作用域插槽",{"type":17,"tag":25,"props":2886,"children":2888},{"className":339,"code":2887,"language":341,"meta":7,"style":7},"\u003Cmy-header>\n \u003Ctemplate #logo>\n \u003Ch2>logo\u003C\u002Fh2>\n \u003C\u002Ftemplate>\n \n \u003Ctemplate #list=\"{ list }\">\n \u003Cul>\n \u003Cli v-for=\"item in list\">\u003C\u002Fli>\n \u003C\u002Ful>\n \u003C\u002Ftemplate>\n\n\u003C\u002Fmy-header>\n\n\napp.component(\"MyHeader\", {\n data() {\n return {\n list: [\"JavaScript\", \"Go\", \"Rust\"]\n } \n },\n template: `\n \u003Cheader>\n \u003Cslot name=\"logo\"\u002F>\n \u003Cslot name=\"list\" :list=\"list\"\u002F>\n \u003C\u002Fheader>\n `\n})\n",[2889],{"type":17,"tag":32,"props":2890,"children":2891},{"__ignoreMap":7},[2892,2907,2914,2921,2928,2935,2943,2950,2958,2965,2972,2979,2994,3001,3008,3016,3024,3032,3040,3048,3056,3065,3083,3092,3101,3118,3127],{"type":17,"tag":36,"props":2893,"children":2894},{"class":38,"line":39},[2895,2899,2903],{"type":17,"tag":36,"props":2896,"children":2897},{"style":80},[2898],{"type":23,"value":528},{"type":17,"tag":36,"props":2900,"children":2901},{"style":86},[2902],{"type":23,"value":2647},{"type":17,"tag":36,"props":2904,"children":2905},{"style":80},[2906],{"type":23,"value":543},{"type":17,"tag":36,"props":2908,"children":2909},{"class":38,"line":48},[2910],{"type":17,"tag":36,"props":2911,"children":2912},{"style":80},[2913],{"type":23,"value":2659},{"type":17,"tag":36,"props":2915,"children":2916},{"class":38,"line":115},[2917],{"type":17,"tag":36,"props":2918,"children":2919},{"style":80},[2920],{"type":23,"value":2667},{"type":17,"tag":36,"props":2922,"children":2923},{"class":38,"line":133},[2924],{"type":17,"tag":36,"props":2925,"children":2926},{"style":80},[2927],{"type":23,"value":2675},{"type":17,"tag":36,"props":2929,"children":2930},{"class":38,"line":157},[2931],{"type":17,"tag":36,"props":2932,"children":2933},{"style":80},[2934],{"type":23,"value":1120},{"type":17,"tag":36,"props":2936,"children":2937},{"class":38,"line":180},[2938],{"type":17,"tag":36,"props":2939,"children":2940},{"style":80},[2941],{"type":23,"value":2942}," \u003Ctemplate #list=\"{ list }\">\n",{"type":17,"tag":36,"props":2944,"children":2945},{"class":38,"line":202},[2946],{"type":17,"tag":36,"props":2947,"children":2948},{"style":80},[2949],{"type":23,"value":2698},{"type":17,"tag":36,"props":2951,"children":2952},{"class":38,"line":224},[2953],{"type":17,"tag":36,"props":2954,"children":2955},{"style":80},[2956],{"type":23,"value":2957}," \u003Cli v-for=\"item in list\">\u003C\u002Fli>\n",{"type":17,"tag":36,"props":2959,"children":2960},{"class":38,"line":246},[2961],{"type":17,"tag":36,"props":2962,"children":2963},{"style":80},[2964],{"type":23,"value":2738},{"type":17,"tag":36,"props":2966,"children":2967},{"class":38,"line":267},[2968],{"type":17,"tag":36,"props":2969,"children":2970},{"style":80},[2971],{"type":23,"value":2675},{"type":17,"tag":36,"props":2973,"children":2974},{"class":38,"line":276},[2975],{"type":17,"tag":36,"props":2976,"children":2977},{"emptyLinePlaceholder":617},[2978],{"type":23,"value":620},{"type":17,"tag":36,"props":2980,"children":2981},{"class":38,"line":285},[2982,2986,2990],{"type":17,"tag":36,"props":2983,"children":2984},{"style":80},[2985],{"type":23,"value":750},{"type":17,"tag":36,"props":2987,"children":2988},{"style":86},[2989],{"type":23,"value":2647},{"type":17,"tag":36,"props":2991,"children":2992},{"style":80},[2993],{"type":23,"value":543},{"type":17,"tag":36,"props":2995,"children":2996},{"class":38,"line":815},[2997],{"type":17,"tag":36,"props":2998,"children":2999},{"emptyLinePlaceholder":617},[3000],{"type":23,"value":620},{"type":17,"tag":36,"props":3002,"children":3003},{"class":38,"line":954},[3004],{"type":17,"tag":36,"props":3005,"children":3006},{"emptyLinePlaceholder":617},[3007],{"type":23,"value":620},{"type":17,"tag":36,"props":3009,"children":3010},{"class":38,"line":971},[3011],{"type":17,"tag":36,"props":3012,"children":3013},{"style":80},[3014],{"type":23,"value":3015},"app.component(\"MyHeader\", {\n",{"type":17,"tag":36,"props":3017,"children":3018},{"class":38,"line":2770},[3019],{"type":17,"tag":36,"props":3020,"children":3021},{"style":80},[3022],{"type":23,"value":3023}," data() {\n",{"type":17,"tag":36,"props":3025,"children":3026},{"class":38,"line":2778},[3027],{"type":17,"tag":36,"props":3028,"children":3029},{"style":80},[3030],{"type":23,"value":3031}," return {\n",{"type":17,"tag":36,"props":3033,"children":3034},{"class":38,"line":2794},[3035],{"type":17,"tag":36,"props":3036,"children":3037},{"style":80},[3038],{"type":23,"value":3039}," list: [\"JavaScript\", \"Go\", \"Rust\"]\n",{"type":17,"tag":36,"props":3041,"children":3042},{"class":38,"line":2830},[3043],{"type":17,"tag":36,"props":3044,"children":3045},{"style":80},[3046],{"type":23,"value":3047}," } \n",{"type":17,"tag":36,"props":3049,"children":3050},{"class":38,"line":2863},[3051],{"type":17,"tag":36,"props":3052,"children":3053},{"style":80},[3054],{"type":23,"value":3055}," },\n",{"type":17,"tag":36,"props":3057,"children":3059},{"class":38,"line":3058},21,[3060],{"type":17,"tag":36,"props":3061,"children":3062},{"style":80},[3063],{"type":23,"value":3064}," template: `\n",{"type":17,"tag":36,"props":3066,"children":3068},{"class":38,"line":3067},22,[3069,3074,3079],{"type":17,"tag":36,"props":3070,"children":3071},{"style":80},[3072],{"type":23,"value":3073}," \u003C",{"type":17,"tag":36,"props":3075,"children":3076},{"style":86},[3077],{"type":23,"value":3078},"header",{"type":17,"tag":36,"props":3080,"children":3081},{"style":80},[3082],{"type":23,"value":543},{"type":17,"tag":36,"props":3084,"children":3086},{"class":38,"line":3085},23,[3087],{"type":17,"tag":36,"props":3088,"children":3089},{"style":80},[3090],{"type":23,"value":3091}," \u003Cslot name=\"logo\"\u002F>\n",{"type":17,"tag":36,"props":3093,"children":3095},{"class":38,"line":3094},24,[3096],{"type":17,"tag":36,"props":3097,"children":3098},{"style":80},[3099],{"type":23,"value":3100}," \u003Cslot name=\"list\" :list=\"list\"\u002F>\n",{"type":17,"tag":36,"props":3102,"children":3104},{"class":38,"line":3103},25,[3105,3110,3114],{"type":17,"tag":36,"props":3106,"children":3107},{"style":80},[3108],{"type":23,"value":3109}," \u003C\u002F",{"type":17,"tag":36,"props":3111,"children":3112},{"style":86},[3113],{"type":23,"value":3078},{"type":17,"tag":36,"props":3115,"children":3116},{"style":80},[3117],{"type":23,"value":543},{"type":17,"tag":36,"props":3119,"children":3121},{"class":38,"line":3120},26,[3122],{"type":17,"tag":36,"props":3123,"children":3124},{"style":80},[3125],{"type":23,"value":3126}," `\n",{"type":17,"tag":36,"props":3128,"children":3130},{"class":38,"line":3129},27,[3131],{"type":17,"tag":36,"props":3132,"children":3133},{"style":80},[3134],{"type":23,"value":1617},{"type":17,"tag":304,"props":3136,"children":3138},{"id":3137},"nexttick",[3139],{"type":23,"value":3140},"nextTick",{"type":17,"tag":368,"props":3142,"children":3143},{},[3144],{"type":17,"tag":323,"props":3145,"children":3146},{},[3147],{"type":23,"value":3148},"将回调推迟到下一个DOM更新周期之后执行。在更改了一些数据以等待DOM更新后立即使用它",{"type":17,"tag":25,"props":3150,"children":3152},{"className":339,"code":3151,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Ch2>Hello nextTick\u003C\u002Fh2>\n \u003Cp ref=\"message\">{{ message }}\u003C\u002Fp>\n\n\u003C\u002Ftemplate>\n\n\u003Cscript>\nexport default {\n name: \"nextTick\",\n data() {\n return {\n message: \"Hello Word\"\n }\n },\n mounted() {\n setTimeout(() => {\n this.message = \"Hello Vue\"\n console.log(this.$refs.message.innerHTML) \u002F\u002F Hello Word\n this.$nextTick(() => {\n console.log(this.$refs.message.innerHTML) \u002F\u002F Hello Vue\n })\n }, 1000)\n },\n\n updated() {\n console.log(this.$refs.message.innerHTML)\n }\n}\n\u003C\u002Fscript>\n\n\u003Cstyle scoped>\n\n\u003C\u002Fstyle>\n",[3153],{"type":17,"tag":32,"props":3154,"children":3155},{"__ignoreMap":7},[3156,3171,3195,3231,3238,3253,3260,3275,3292,3310,3322,3334,3347,3354,3362,3374,3394,3416,3447,3475,3504,3512,3529,3536,3543,3555,3580,3587,3595,3611,3619,3640,3648],{"type":17,"tag":36,"props":3157,"children":3158},{"class":38,"line":39},[3159,3163,3167],{"type":17,"tag":36,"props":3160,"children":3161},{"style":80},[3162],{"type":23,"value":528},{"type":17,"tag":36,"props":3164,"children":3165},{"style":86},[3166],{"type":23,"value":777},{"type":17,"tag":36,"props":3168,"children":3169},{"style":80},[3170],{"type":23,"value":543},{"type":17,"tag":36,"props":3172,"children":3173},{"class":38,"line":48},[3174,3178,3182,3187,3191],{"type":17,"tag":36,"props":3175,"children":3176},{"style":80},[3177],{"type":23,"value":789},{"type":17,"tag":36,"props":3179,"children":3180},{"style":86},[3181],{"type":23,"value":61},{"type":17,"tag":36,"props":3183,"children":3184},{"style":80},[3185],{"type":23,"value":3186},">Hello nextTick\u003C\u002F",{"type":17,"tag":36,"props":3188,"children":3189},{"style":86},[3190],{"type":23,"value":61},{"type":17,"tag":36,"props":3192,"children":3193},{"style":80},[3194],{"type":23,"value":543},{"type":17,"tag":36,"props":3196,"children":3197},{"class":38,"line":115},[3198,3202,3206,3210,3214,3218,3223,3227],{"type":17,"tag":36,"props":3199,"children":3200},{"style":80},[3201],{"type":23,"value":789},{"type":17,"tag":36,"props":3203,"children":3204},{"style":86},[3205],{"type":23,"value":323},{"type":17,"tag":36,"props":3207,"children":3208},{"style":411},[3209],{"type":23,"value":414},{"type":17,"tag":36,"props":3211,"children":3212},{"style":80},[3213],{"type":23,"value":482},{"type":17,"tag":36,"props":3215,"children":3216},{"style":422},[3217],{"type":23,"value":2490},{"type":17,"tag":36,"props":3219,"children":3220},{"style":80},[3221],{"type":23,"value":3222},">{{ message }}\u003C\u002F",{"type":17,"tag":36,"props":3224,"children":3225},{"style":86},[3226],{"type":23,"value":323},{"type":17,"tag":36,"props":3228,"children":3229},{"style":80},[3230],{"type":23,"value":543},{"type":17,"tag":36,"props":3232,"children":3233},{"class":38,"line":133},[3234],{"type":17,"tag":36,"props":3235,"children":3236},{"emptyLinePlaceholder":617},[3237],{"type":23,"value":620},{"type":17,"tag":36,"props":3239,"children":3240},{"class":38,"line":157},[3241,3245,3249],{"type":17,"tag":36,"props":3242,"children":3243},{"style":80},[3244],{"type":23,"value":750},{"type":17,"tag":36,"props":3246,"children":3247},{"style":86},[3248],{"type":23,"value":777},{"type":17,"tag":36,"props":3250,"children":3251},{"style":80},[3252],{"type":23,"value":543},{"type":17,"tag":36,"props":3254,"children":3255},{"class":38,"line":180},[3256],{"type":17,"tag":36,"props":3257,"children":3258},{"emptyLinePlaceholder":617},[3259],{"type":23,"value":620},{"type":17,"tag":36,"props":3261,"children":3262},{"class":38,"line":202},[3263,3267,3271],{"type":17,"tag":36,"props":3264,"children":3265},{"style":80},[3266],{"type":23,"value":528},{"type":17,"tag":36,"props":3268,"children":3269},{"style":86},[3270],{"type":23,"value":533},{"type":17,"tag":36,"props":3272,"children":3273},{"style":80},[3274],{"type":23,"value":543},{"type":17,"tag":36,"props":3276,"children":3277},{"class":38,"line":224},[3278,3283,3288],{"type":17,"tag":36,"props":3279,"children":3280},{"style":395},[3281],{"type":23,"value":3282},"export",{"type":17,"tag":36,"props":3284,"children":3285},{"style":395},[3286],{"type":23,"value":3287}," default",{"type":17,"tag":36,"props":3289,"children":3290},{"style":80},[3291],{"type":23,"value":94},{"type":17,"tag":36,"props":3293,"children":3294},{"class":38,"line":246},[3295,3300,3305],{"type":17,"tag":36,"props":3296,"children":3297},{"style":80},[3298],{"type":23,"value":3299}," name: ",{"type":17,"tag":36,"props":3301,"children":3302},{"style":422},[3303],{"type":23,"value":3304},"\"nextTick\"",{"type":17,"tag":36,"props":3306,"children":3307},{"style":80},[3308],{"type":23,"value":3309},",\n",{"type":17,"tag":36,"props":3311,"children":3312},{"class":38,"line":267},[3313,3318],{"type":17,"tag":36,"props":3314,"children":3315},{"style":411},[3316],{"type":23,"value":3317}," data",{"type":17,"tag":36,"props":3319,"children":3320},{"style":80},[3321],{"type":23,"value":638},{"type":17,"tag":36,"props":3323,"children":3324},{"class":38,"line":276},[3325,3330],{"type":17,"tag":36,"props":3326,"children":3327},{"style":395},[3328],{"type":23,"value":3329}," return",{"type":17,"tag":36,"props":3331,"children":3332},{"style":80},[3333],{"type":23,"value":94},{"type":17,"tag":36,"props":3335,"children":3336},{"class":38,"line":285},[3337,3342],{"type":17,"tag":36,"props":3338,"children":3339},{"style":80},[3340],{"type":23,"value":3341}," message: ",{"type":17,"tag":36,"props":3343,"children":3344},{"style":422},[3345],{"type":23,"value":3346},"\"Hello Word\"\n",{"type":17,"tag":36,"props":3348,"children":3349},{"class":38,"line":815},[3350],{"type":17,"tag":36,"props":3351,"children":3352},{"style":80},[3353],{"type":23,"value":273},{"type":17,"tag":36,"props":3355,"children":3356},{"class":38,"line":954},[3357],{"type":17,"tag":36,"props":3358,"children":3359},{"style":80},[3360],{"type":23,"value":3361}," },\n",{"type":17,"tag":36,"props":3363,"children":3364},{"class":38,"line":971},[3365,3370],{"type":17,"tag":36,"props":3366,"children":3367},{"style":411},[3368],{"type":23,"value":3369}," mounted",{"type":17,"tag":36,"props":3371,"children":3372},{"style":80},[3373],{"type":23,"value":638},{"type":17,"tag":36,"props":3375,"children":3376},{"class":38,"line":2770},[3377,3382,3386,3390],{"type":17,"tag":36,"props":3378,"children":3379},{"style":411},[3380],{"type":23,"value":3381}," setTimeout",{"type":17,"tag":36,"props":3383,"children":3384},{"style":80},[3385],{"type":23,"value":1133},{"type":17,"tag":36,"props":3387,"children":3388},{"style":395},[3389],{"type":23,"value":1138},{"type":17,"tag":36,"props":3391,"children":3392},{"style":80},[3393],{"type":23,"value":94},{"type":17,"tag":36,"props":3395,"children":3396},{"class":38,"line":2778},[3397,3402,3407,3411],{"type":17,"tag":36,"props":3398,"children":3399},{"style":105},[3400],{"type":23,"value":3401}," this",{"type":17,"tag":36,"props":3403,"children":3404},{"style":80},[3405],{"type":23,"value":3406},".message ",{"type":17,"tag":36,"props":3408,"children":3409},{"style":395},[3410],{"type":23,"value":482},{"type":17,"tag":36,"props":3412,"children":3413},{"style":422},[3414],{"type":23,"value":3415}," \"Hello Vue\"\n",{"type":17,"tag":36,"props":3417,"children":3418},{"class":38,"line":2794},[3419,3424,3429,3433,3437,3442],{"type":17,"tag":36,"props":3420,"children":3421},{"style":80},[3422],{"type":23,"value":3423}," console.",{"type":17,"tag":36,"props":3425,"children":3426},{"style":411},[3427],{"type":23,"value":3428},"log",{"type":17,"tag":36,"props":3430,"children":3431},{"style":80},[3432],{"type":23,"value":419},{"type":17,"tag":36,"props":3434,"children":3435},{"style":105},[3436],{"type":23,"value":1731},{"type":17,"tag":36,"props":3438,"children":3439},{"style":80},[3440],{"type":23,"value":3441},".$refs.message.innerHTML) ",{"type":17,"tag":36,"props":3443,"children":3444},{"style":1805},[3445],{"type":23,"value":3446},"\u002F\u002F Hello Word\n",{"type":17,"tag":36,"props":3448,"children":3449},{"class":38,"line":2830},[3450,3454,3458,3463,3467,3471],{"type":17,"tag":36,"props":3451,"children":3452},{"style":105},[3453],{"type":23,"value":3401},{"type":17,"tag":36,"props":3455,"children":3456},{"style":80},[3457],{"type":23,"value":1420},{"type":17,"tag":36,"props":3459,"children":3460},{"style":411},[3461],{"type":23,"value":3462},"$nextTick",{"type":17,"tag":36,"props":3464,"children":3465},{"style":80},[3466],{"type":23,"value":1133},{"type":17,"tag":36,"props":3468,"children":3469},{"style":395},[3470],{"type":23,"value":1138},{"type":17,"tag":36,"props":3472,"children":3473},{"style":80},[3474],{"type":23,"value":94},{"type":17,"tag":36,"props":3476,"children":3477},{"class":38,"line":2863},[3478,3483,3487,3491,3495,3499],{"type":17,"tag":36,"props":3479,"children":3480},{"style":80},[3481],{"type":23,"value":3482}," console.",{"type":17,"tag":36,"props":3484,"children":3485},{"style":411},[3486],{"type":23,"value":3428},{"type":17,"tag":36,"props":3488,"children":3489},{"style":80},[3490],{"type":23,"value":419},{"type":17,"tag":36,"props":3492,"children":3493},{"style":105},[3494],{"type":23,"value":1731},{"type":17,"tag":36,"props":3496,"children":3497},{"style":80},[3498],{"type":23,"value":3441},{"type":17,"tag":36,"props":3500,"children":3501},{"style":1805},[3502],{"type":23,"value":3503},"\u002F\u002F Hello Vue\n",{"type":17,"tag":36,"props":3505,"children":3506},{"class":38,"line":3058},[3507],{"type":17,"tag":36,"props":3508,"children":3509},{"style":80},[3510],{"type":23,"value":3511}," })\n",{"type":17,"tag":36,"props":3513,"children":3514},{"class":38,"line":3067},[3515,3520,3525],{"type":17,"tag":36,"props":3516,"children":3517},{"style":80},[3518],{"type":23,"value":3519}," }, ",{"type":17,"tag":36,"props":3521,"children":3522},{"style":105},[3523],{"type":23,"value":3524},"1000",{"type":17,"tag":36,"props":3526,"children":3527},{"style":80},[3528],{"type":23,"value":430},{"type":17,"tag":36,"props":3530,"children":3531},{"class":38,"line":3085},[3532],{"type":17,"tag":36,"props":3533,"children":3534},{"style":80},[3535],{"type":23,"value":3361},{"type":17,"tag":36,"props":3537,"children":3538},{"class":38,"line":3094},[3539],{"type":17,"tag":36,"props":3540,"children":3541},{"emptyLinePlaceholder":617},[3542],{"type":23,"value":620},{"type":17,"tag":36,"props":3544,"children":3545},{"class":38,"line":3103},[3546,3551],{"type":17,"tag":36,"props":3547,"children":3548},{"style":411},[3549],{"type":23,"value":3550}," updated",{"type":17,"tag":36,"props":3552,"children":3553},{"style":80},[3554],{"type":23,"value":638},{"type":17,"tag":36,"props":3556,"children":3557},{"class":38,"line":3120},[3558,3563,3567,3571,3575],{"type":17,"tag":36,"props":3559,"children":3560},{"style":80},[3561],{"type":23,"value":3562}," console.",{"type":17,"tag":36,"props":3564,"children":3565},{"style":411},[3566],{"type":23,"value":3428},{"type":17,"tag":36,"props":3568,"children":3569},{"style":80},[3570],{"type":23,"value":419},{"type":17,"tag":36,"props":3572,"children":3573},{"style":105},[3574],{"type":23,"value":1731},{"type":17,"tag":36,"props":3576,"children":3577},{"style":80},[3578],{"type":23,"value":3579},".$refs.message.innerHTML)\n",{"type":17,"tag":36,"props":3581,"children":3582},{"class":38,"line":3129},[3583],{"type":17,"tag":36,"props":3584,"children":3585},{"style":80},[3586],{"type":23,"value":282},{"type":17,"tag":36,"props":3588,"children":3590},{"class":38,"line":3589},28,[3591],{"type":17,"tag":36,"props":3592,"children":3593},{"style":80},[3594],{"type":23,"value":291},{"type":17,"tag":36,"props":3596,"children":3598},{"class":38,"line":3597},29,[3599,3603,3607],{"type":17,"tag":36,"props":3600,"children":3601},{"style":80},[3602],{"type":23,"value":750},{"type":17,"tag":36,"props":3604,"children":3605},{"style":86},[3606],{"type":23,"value":533},{"type":17,"tag":36,"props":3608,"children":3609},{"style":80},[3610],{"type":23,"value":543},{"type":17,"tag":36,"props":3612,"children":3614},{"class":38,"line":3613},30,[3615],{"type":17,"tag":36,"props":3616,"children":3617},{"emptyLinePlaceholder":617},[3618],{"type":23,"value":620},{"type":17,"tag":36,"props":3620,"children":3622},{"class":38,"line":3621},31,[3623,3627,3631,3636],{"type":17,"tag":36,"props":3624,"children":3625},{"style":80},[3626],{"type":23,"value":528},{"type":17,"tag":36,"props":3628,"children":3629},{"style":86},[3630],{"type":23,"value":505},{"type":17,"tag":36,"props":3632,"children":3633},{"style":411},[3634],{"type":23,"value":3635}," scoped",{"type":17,"tag":36,"props":3637,"children":3638},{"style":80},[3639],{"type":23,"value":543},{"type":17,"tag":36,"props":3641,"children":3643},{"class":38,"line":3642},32,[3644],{"type":17,"tag":36,"props":3645,"children":3646},{"emptyLinePlaceholder":617},[3647],{"type":23,"value":620},{"type":17,"tag":36,"props":3649,"children":3651},{"class":38,"line":3650},33,[3652,3656,3660],{"type":17,"tag":36,"props":3653,"children":3654},{"style":80},[3655],{"type":23,"value":750},{"type":17,"tag":36,"props":3657,"children":3658},{"style":86},[3659],{"type":23,"value":505},{"type":17,"tag":36,"props":3661,"children":3662},{"style":80},[3663],{"type":23,"value":543},{"type":17,"tag":304,"props":3665,"children":3667},{"id":3666},"自定义指令",[3668],{"type":23,"value":3666},{"type":17,"tag":323,"props":3670,"children":3671},{},[3672],{"type":17,"tag":1637,"props":3673,"children":3674},{},[3675],{"type":23,"value":3676},"真是使用场景：",{"type":17,"tag":323,"props":3678,"children":3679},{},[3680],{"type":23,"value":3681},"前端根据后端传过来的权限，显示和隐藏组件",{"type":17,"tag":25,"props":3683,"children":3685},{"className":339,"code":3684,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Ch2>自定义指令\u003C\u002Fh2>\n \u003Cbutton v-auth=\"'edit'\">编辑\u003C\u002Fbutton>\n\u003C\u002Ftemplate>\n\n\u003Cscript>\nexport default {\n name: \"02_自定义指令\",\n data() {\n return {}\n },\n \u002F\u002F 注册局部自定义指令\n directives: {\n auth: (el, binding) => {\n const auths = [\"edit\",\"add\"]\n \u002F\u002F const auths = [\"add\"]\n const res = auths.includes(binding.value)\n \u002F\u002F 当有edit的权限，显示按钮；没有权限，隐藏按钮\n if (!res) {\n el.style.display = \"none\"\n }\n }\n }\n}\n\u003C\u002Fscript>\n",[3686],{"type":17,"tag":32,"props":3687,"children":3688},{"__ignoreMap":7},[3689,3704,3728,3767,3782,3789,3804,3819,3835,3846,3858,3865,3873,3881,3922,3964,3972,4003,4011,4033,4050,4058,4065,4072,4079],{"type":17,"tag":36,"props":3690,"children":3691},{"class":38,"line":39},[3692,3696,3700],{"type":17,"tag":36,"props":3693,"children":3694},{"style":80},[3695],{"type":23,"value":528},{"type":17,"tag":36,"props":3697,"children":3698},{"style":86},[3699],{"type":23,"value":777},{"type":17,"tag":36,"props":3701,"children":3702},{"style":80},[3703],{"type":23,"value":543},{"type":17,"tag":36,"props":3705,"children":3706},{"class":38,"line":48},[3707,3711,3715,3720,3724],{"type":17,"tag":36,"props":3708,"children":3709},{"style":80},[3710],{"type":23,"value":789},{"type":17,"tag":36,"props":3712,"children":3713},{"style":86},[3714],{"type":23,"value":61},{"type":17,"tag":36,"props":3716,"children":3717},{"style":80},[3718],{"type":23,"value":3719},">自定义指令\u003C\u002F",{"type":17,"tag":36,"props":3721,"children":3722},{"style":86},[3723],{"type":23,"value":61},{"type":17,"tag":36,"props":3725,"children":3726},{"style":80},[3727],{"type":23,"value":543},{"type":17,"tag":36,"props":3729,"children":3730},{"class":38,"line":115},[3731,3735,3740,3745,3749,3754,3759,3763],{"type":17,"tag":36,"props":3732,"children":3733},{"style":80},[3734],{"type":23,"value":789},{"type":17,"tag":36,"props":3736,"children":3737},{"style":86},[3738],{"type":23,"value":3739},"button",{"type":17,"tag":36,"props":3741,"children":3742},{"style":411},[3743],{"type":23,"value":3744}," v-auth",{"type":17,"tag":36,"props":3746,"children":3747},{"style":80},[3748],{"type":23,"value":482},{"type":17,"tag":36,"props":3750,"children":3751},{"style":422},[3752],{"type":23,"value":3753},"\"'edit'\"",{"type":17,"tag":36,"props":3755,"children":3756},{"style":80},[3757],{"type":23,"value":3758},">编辑\u003C\u002F",{"type":17,"tag":36,"props":3760,"children":3761},{"style":86},[3762],{"type":23,"value":3739},{"type":17,"tag":36,"props":3764,"children":3765},{"style":80},[3766],{"type":23,"value":543},{"type":17,"tag":36,"props":3768,"children":3769},{"class":38,"line":133},[3770,3774,3778],{"type":17,"tag":36,"props":3771,"children":3772},{"style":80},[3773],{"type":23,"value":750},{"type":17,"tag":36,"props":3775,"children":3776},{"style":86},[3777],{"type":23,"value":777},{"type":17,"tag":36,"props":3779,"children":3780},{"style":80},[3781],{"type":23,"value":543},{"type":17,"tag":36,"props":3783,"children":3784},{"class":38,"line":157},[3785],{"type":17,"tag":36,"props":3786,"children":3787},{"emptyLinePlaceholder":617},[3788],{"type":23,"value":620},{"type":17,"tag":36,"props":3790,"children":3791},{"class":38,"line":180},[3792,3796,3800],{"type":17,"tag":36,"props":3793,"children":3794},{"style":80},[3795],{"type":23,"value":528},{"type":17,"tag":36,"props":3797,"children":3798},{"style":86},[3799],{"type":23,"value":533},{"type":17,"tag":36,"props":3801,"children":3802},{"style":80},[3803],{"type":23,"value":543},{"type":17,"tag":36,"props":3805,"children":3806},{"class":38,"line":202},[3807,3811,3815],{"type":17,"tag":36,"props":3808,"children":3809},{"style":395},[3810],{"type":23,"value":3282},{"type":17,"tag":36,"props":3812,"children":3813},{"style":395},[3814],{"type":23,"value":3287},{"type":17,"tag":36,"props":3816,"children":3817},{"style":80},[3818],{"type":23,"value":94},{"type":17,"tag":36,"props":3820,"children":3821},{"class":38,"line":224},[3822,3826,3831],{"type":17,"tag":36,"props":3823,"children":3824},{"style":80},[3825],{"type":23,"value":3299},{"type":17,"tag":36,"props":3827,"children":3828},{"style":422},[3829],{"type":23,"value":3830},"\"02_自定义指令\"",{"type":17,"tag":36,"props":3832,"children":3833},{"style":80},[3834],{"type":23,"value":3309},{"type":17,"tag":36,"props":3836,"children":3837},{"class":38,"line":246},[3838,3842],{"type":17,"tag":36,"props":3839,"children":3840},{"style":411},[3841],{"type":23,"value":3317},{"type":17,"tag":36,"props":3843,"children":3844},{"style":80},[3845],{"type":23,"value":638},{"type":17,"tag":36,"props":3847,"children":3848},{"class":38,"line":267},[3849,3853],{"type":17,"tag":36,"props":3850,"children":3851},{"style":395},[3852],{"type":23,"value":3329},{"type":17,"tag":36,"props":3854,"children":3855},{"style":80},[3856],{"type":23,"value":3857}," {}\n",{"type":17,"tag":36,"props":3859,"children":3860},{"class":38,"line":276},[3861],{"type":17,"tag":36,"props":3862,"children":3863},{"style":80},[3864],{"type":23,"value":3361},{"type":17,"tag":36,"props":3866,"children":3867},{"class":38,"line":285},[3868],{"type":17,"tag":36,"props":3869,"children":3870},{"style":1805},[3871],{"type":23,"value":3872}," \u002F\u002F 注册局部自定义指令\n",{"type":17,"tag":36,"props":3874,"children":3875},{"class":38,"line":815},[3876],{"type":17,"tag":36,"props":3877,"children":3878},{"style":80},[3879],{"type":23,"value":3880}," directives: {\n",{"type":17,"tag":36,"props":3882,"children":3883},{"class":38,"line":954},[3884,3889,3894,3899,3904,3909,3914,3918],{"type":17,"tag":36,"props":3885,"children":3886},{"style":411},[3887],{"type":23,"value":3888}," auth",{"type":17,"tag":36,"props":3890,"children":3891},{"style":80},[3892],{"type":23,"value":3893},": (",{"type":17,"tag":36,"props":3895,"children":3896},{"style":1856},[3897],{"type":23,"value":3898},"el",{"type":17,"tag":36,"props":3900,"children":3901},{"style":80},[3902],{"type":23,"value":3903},", ",{"type":17,"tag":36,"props":3905,"children":3906},{"style":1856},[3907],{"type":23,"value":3908},"binding",{"type":17,"tag":36,"props":3910,"children":3911},{"style":80},[3912],{"type":23,"value":3913},") ",{"type":17,"tag":36,"props":3915,"children":3916},{"style":395},[3917],{"type":23,"value":1138},{"type":17,"tag":36,"props":3919,"children":3920},{"style":80},[3921],{"type":23,"value":94},{"type":17,"tag":36,"props":3923,"children":3924},{"class":38,"line":971},[3925,3930,3935,3939,3944,3949,3954,3959],{"type":17,"tag":36,"props":3926,"children":3927},{"style":395},[3928],{"type":23,"value":3929}," const",{"type":17,"tag":36,"props":3931,"children":3932},{"style":105},[3933],{"type":23,"value":3934}," auths",{"type":17,"tag":36,"props":3936,"children":3937},{"style":395},[3938],{"type":23,"value":408},{"type":17,"tag":36,"props":3940,"children":3941},{"style":80},[3942],{"type":23,"value":3943}," [",{"type":17,"tag":36,"props":3945,"children":3946},{"style":422},[3947],{"type":23,"value":3948},"\"edit\"",{"type":17,"tag":36,"props":3950,"children":3951},{"style":80},[3952],{"type":23,"value":3953},",",{"type":17,"tag":36,"props":3955,"children":3956},{"style":422},[3957],{"type":23,"value":3958},"\"add\"",{"type":17,"tag":36,"props":3960,"children":3961},{"style":80},[3962],{"type":23,"value":3963},"]\n",{"type":17,"tag":36,"props":3965,"children":3966},{"class":38,"line":2770},[3967],{"type":17,"tag":36,"props":3968,"children":3969},{"style":1805},[3970],{"type":23,"value":3971}," \u002F\u002F const auths = [\"add\"]\n",{"type":17,"tag":36,"props":3973,"children":3974},{"class":38,"line":2778},[3975,3979,3984,3988,3993,3998],{"type":17,"tag":36,"props":3976,"children":3977},{"style":395},[3978],{"type":23,"value":3929},{"type":17,"tag":36,"props":3980,"children":3981},{"style":105},[3982],{"type":23,"value":3983}," res",{"type":17,"tag":36,"props":3985,"children":3986},{"style":395},[3987],{"type":23,"value":408},{"type":17,"tag":36,"props":3989,"children":3990},{"style":80},[3991],{"type":23,"value":3992}," auths.",{"type":17,"tag":36,"props":3994,"children":3995},{"style":411},[3996],{"type":23,"value":3997},"includes",{"type":17,"tag":36,"props":3999,"children":4000},{"style":80},[4001],{"type":23,"value":4002},"(binding.value)\n",{"type":17,"tag":36,"props":4004,"children":4005},{"class":38,"line":2794},[4006],{"type":17,"tag":36,"props":4007,"children":4008},{"style":1805},[4009],{"type":23,"value":4010}," \u002F\u002F 当有edit的权限，显示按钮；没有权限，隐藏按钮\n",{"type":17,"tag":36,"props":4012,"children":4013},{"class":38,"line":2830},[4014,4019,4024,4028],{"type":17,"tag":36,"props":4015,"children":4016},{"style":395},[4017],{"type":23,"value":4018}," if",{"type":17,"tag":36,"props":4020,"children":4021},{"style":80},[4022],{"type":23,"value":4023}," (",{"type":17,"tag":36,"props":4025,"children":4026},{"style":395},[4027],{"type":23,"value":1977},{"type":17,"tag":36,"props":4029,"children":4030},{"style":80},[4031],{"type":23,"value":4032},"res) {\n",{"type":17,"tag":36,"props":4034,"children":4035},{"class":38,"line":2863},[4036,4041,4045],{"type":17,"tag":36,"props":4037,"children":4038},{"style":80},[4039],{"type":23,"value":4040}," el.style.display ",{"type":17,"tag":36,"props":4042,"children":4043},{"style":395},[4044],{"type":23,"value":482},{"type":17,"tag":36,"props":4046,"children":4047},{"style":422},[4048],{"type":23,"value":4049}," \"none\"\n",{"type":17,"tag":36,"props":4051,"children":4052},{"class":38,"line":3058},[4053],{"type":17,"tag":36,"props":4054,"children":4055},{"style":80},[4056],{"type":23,"value":4057}," }\n",{"type":17,"tag":36,"props":4059,"children":4060},{"class":38,"line":3067},[4061],{"type":17,"tag":36,"props":4062,"children":4063},{"style":80},[4064],{"type":23,"value":273},{"type":17,"tag":36,"props":4066,"children":4067},{"class":38,"line":3085},[4068],{"type":17,"tag":36,"props":4069,"children":4070},{"style":80},[4071],{"type":23,"value":282},{"type":17,"tag":36,"props":4073,"children":4074},{"class":38,"line":3094},[4075],{"type":17,"tag":36,"props":4076,"children":4077},{"style":80},[4078],{"type":23,"value":291},{"type":17,"tag":36,"props":4080,"children":4081},{"class":38,"line":3103},[4082,4086,4090],{"type":17,"tag":36,"props":4083,"children":4084},{"style":80},[4085],{"type":23,"value":750},{"type":17,"tag":36,"props":4087,"children":4088},{"style":86},[4089],{"type":23,"value":533},{"type":17,"tag":36,"props":4091,"children":4092},{"style":80},[4093],{"type":23,"value":543},{"type":17,"tag":323,"props":4095,"children":4096},{},[4097],{"type":17,"tag":1637,"props":4098,"children":4099},{},[4100],{"type":23,"value":4101},"全局自定义指令：",{"type":17,"tag":25,"props":4103,"children":4105},{"className":383,"code":4104,"language":385,"meta":7,"style":7},"import { createApp } from 'vue'\nimport '.\u002Fstyle.css'\nimport App from '.\u002Fcomponents\u002F02_自定义指令.vue'\n\nconst app = createApp(App)\n\napp.directive(\"auth\", (el, binding) => {\n \u002F\u002F const auths = [\"edit\", \"add\"]\n const auths = [\"add\"]\n const res = auths.includes(binding.value)\n \u002F\u002F 当有edit的权限，显示按钮；没有权限，隐藏按钮\n if (!res) {\n el.style.display = \"none\"\n }\n})\napp.mount('#app')\n",[4106],{"type":17,"tag":32,"props":4107,"children":4108},{"__ignoreMap":7},[4109,4129,4141,4162,4169,4195,4202,4253,4261,4288,4315,4323,4343,4358,4365,4372],{"type":17,"tag":36,"props":4110,"children":4111},{"class":38,"line":39},[4112,4116,4121,4125],{"type":17,"tag":36,"props":4113,"children":4114},{"style":395},[4115],{"type":23,"value":1768},{"type":17,"tag":36,"props":4117,"children":4118},{"style":80},[4119],{"type":23,"value":4120}," { createApp } ",{"type":17,"tag":36,"props":4122,"children":4123},{"style":395},[4124],{"type":23,"value":1047},{"type":17,"tag":36,"props":4126,"children":4127},{"style":422},[4128],{"type":23,"value":1052},{"type":17,"tag":36,"props":4130,"children":4131},{"class":38,"line":48},[4132,4136],{"type":17,"tag":36,"props":4133,"children":4134},{"style":395},[4135],{"type":23,"value":1768},{"type":17,"tag":36,"props":4137,"children":4138},{"style":422},[4139],{"type":23,"value":4140}," '.\u002Fstyle.css'\n",{"type":17,"tag":36,"props":4142,"children":4143},{"class":38,"line":115},[4144,4148,4153,4157],{"type":17,"tag":36,"props":4145,"children":4146},{"style":395},[4147],{"type":23,"value":1768},{"type":17,"tag":36,"props":4149,"children":4150},{"style":80},[4151],{"type":23,"value":4152}," App ",{"type":17,"tag":36,"props":4154,"children":4155},{"style":395},[4156],{"type":23,"value":1047},{"type":17,"tag":36,"props":4158,"children":4159},{"style":422},[4160],{"type":23,"value":4161}," '.\u002Fcomponents\u002F02_自定义指令.vue'\n",{"type":17,"tag":36,"props":4163,"children":4164},{"class":38,"line":133},[4165],{"type":17,"tag":36,"props":4166,"children":4167},{"emptyLinePlaceholder":617},[4168],{"type":23,"value":620},{"type":17,"tag":36,"props":4170,"children":4171},{"class":38,"line":157},[4172,4176,4181,4185,4190],{"type":17,"tag":36,"props":4173,"children":4174},{"style":395},[4175],{"type":23,"value":398},{"type":17,"tag":36,"props":4177,"children":4178},{"style":105},[4179],{"type":23,"value":4180}," app",{"type":17,"tag":36,"props":4182,"children":4183},{"style":395},[4184],{"type":23,"value":408},{"type":17,"tag":36,"props":4186,"children":4187},{"style":411},[4188],{"type":23,"value":4189}," createApp",{"type":17,"tag":36,"props":4191,"children":4192},{"style":80},[4193],{"type":23,"value":4194},"(App)\n",{"type":17,"tag":36,"props":4196,"children":4197},{"class":38,"line":180},[4198],{"type":17,"tag":36,"props":4199,"children":4200},{"emptyLinePlaceholder":617},[4201],{"type":23,"value":620},{"type":17,"tag":36,"props":4203,"children":4204},{"class":38,"line":202},[4205,4210,4215,4219,4224,4229,4233,4237,4241,4245,4249],{"type":17,"tag":36,"props":4206,"children":4207},{"style":80},[4208],{"type":23,"value":4209},"app.",{"type":17,"tag":36,"props":4211,"children":4212},{"style":411},[4213],{"type":23,"value":4214},"directive",{"type":17,"tag":36,"props":4216,"children":4217},{"style":80},[4218],{"type":23,"value":419},{"type":17,"tag":36,"props":4220,"children":4221},{"style":422},[4222],{"type":23,"value":4223},"\"auth\"",{"type":17,"tag":36,"props":4225,"children":4226},{"style":80},[4227],{"type":23,"value":4228},", (",{"type":17,"tag":36,"props":4230,"children":4231},{"style":1856},[4232],{"type":23,"value":3898},{"type":17,"tag":36,"props":4234,"children":4235},{"style":80},[4236],{"type":23,"value":3903},{"type":17,"tag":36,"props":4238,"children":4239},{"style":1856},[4240],{"type":23,"value":3908},{"type":17,"tag":36,"props":4242,"children":4243},{"style":80},[4244],{"type":23,"value":3913},{"type":17,"tag":36,"props":4246,"children":4247},{"style":395},[4248],{"type":23,"value":1138},{"type":17,"tag":36,"props":4250,"children":4251},{"style":80},[4252],{"type":23,"value":94},{"type":17,"tag":36,"props":4254,"children":4255},{"class":38,"line":224},[4256],{"type":17,"tag":36,"props":4257,"children":4258},{"style":1805},[4259],{"type":23,"value":4260}," \u002F\u002F const auths = [\"edit\", \"add\"]\n",{"type":17,"tag":36,"props":4262,"children":4263},{"class":38,"line":246},[4264,4268,4272,4276,4280,4284],{"type":17,"tag":36,"props":4265,"children":4266},{"style":395},[4267],{"type":23,"value":1926},{"type":17,"tag":36,"props":4269,"children":4270},{"style":105},[4271],{"type":23,"value":3934},{"type":17,"tag":36,"props":4273,"children":4274},{"style":395},[4275],{"type":23,"value":408},{"type":17,"tag":36,"props":4277,"children":4278},{"style":80},[4279],{"type":23,"value":3943},{"type":17,"tag":36,"props":4281,"children":4282},{"style":422},[4283],{"type":23,"value":3958},{"type":17,"tag":36,"props":4285,"children":4286},{"style":80},[4287],{"type":23,"value":3963},{"type":17,"tag":36,"props":4289,"children":4290},{"class":38,"line":267},[4291,4295,4299,4303,4307,4311],{"type":17,"tag":36,"props":4292,"children":4293},{"style":395},[4294],{"type":23,"value":1926},{"type":17,"tag":36,"props":4296,"children":4297},{"style":105},[4298],{"type":23,"value":3983},{"type":17,"tag":36,"props":4300,"children":4301},{"style":395},[4302],{"type":23,"value":408},{"type":17,"tag":36,"props":4304,"children":4305},{"style":80},[4306],{"type":23,"value":3992},{"type":17,"tag":36,"props":4308,"children":4309},{"style":411},[4310],{"type":23,"value":3997},{"type":17,"tag":36,"props":4312,"children":4313},{"style":80},[4314],{"type":23,"value":4002},{"type":17,"tag":36,"props":4316,"children":4317},{"class":38,"line":276},[4318],{"type":17,"tag":36,"props":4319,"children":4320},{"style":1805},[4321],{"type":23,"value":4322}," \u002F\u002F 当有edit的权限，显示按钮；没有权限，隐藏按钮\n",{"type":17,"tag":36,"props":4324,"children":4325},{"class":38,"line":285},[4326,4331,4335,4339],{"type":17,"tag":36,"props":4327,"children":4328},{"style":395},[4329],{"type":23,"value":4330}," if",{"type":17,"tag":36,"props":4332,"children":4333},{"style":80},[4334],{"type":23,"value":4023},{"type":17,"tag":36,"props":4336,"children":4337},{"style":395},[4338],{"type":23,"value":1977},{"type":17,"tag":36,"props":4340,"children":4341},{"style":80},[4342],{"type":23,"value":4032},{"type":17,"tag":36,"props":4344,"children":4345},{"class":38,"line":815},[4346,4350,4354],{"type":17,"tag":36,"props":4347,"children":4348},{"style":80},[4349],{"type":23,"value":4040},{"type":17,"tag":36,"props":4351,"children":4352},{"style":395},[4353],{"type":23,"value":482},{"type":17,"tag":36,"props":4355,"children":4356},{"style":422},[4357],{"type":23,"value":4049},{"type":17,"tag":36,"props":4359,"children":4360},{"class":38,"line":954},[4361],{"type":17,"tag":36,"props":4362,"children":4363},{"style":80},[4364],{"type":23,"value":273},{"type":17,"tag":36,"props":4366,"children":4367},{"class":38,"line":971},[4368],{"type":17,"tag":36,"props":4369,"children":4370},{"style":80},[4371],{"type":23,"value":1617},{"type":17,"tag":36,"props":4373,"children":4374},{"class":38,"line":2770},[4375,4379,4384,4388,4393],{"type":17,"tag":36,"props":4376,"children":4377},{"style":80},[4378],{"type":23,"value":4209},{"type":17,"tag":36,"props":4380,"children":4381},{"style":411},[4382],{"type":23,"value":4383},"mount",{"type":17,"tag":36,"props":4385,"children":4386},{"style":80},[4387],{"type":23,"value":419},{"type":17,"tag":36,"props":4389,"children":4390},{"style":422},[4391],{"type":23,"value":4392},"'#app'",{"type":17,"tag":36,"props":4394,"children":4395},{"style":80},[4396],{"type":23,"value":430},{"type":17,"tag":304,"props":4398,"children":4400},{"id":4399},"transition动画",[4401],{"type":23,"value":4399},{"type":17,"tag":25,"props":4403,"children":4405},{"className":339,"code":4404,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Ch2>transition\u003C\u002Fh2>\n \u003Cbutton @click=\"isShow = !isShow\">点击切换状态\u003C\u002Fbutton>\n \u003C!-- 先进后出 -->\n \u003Ctransition name=\"fade\" mode=\"out-in\">\n \u003Cdiv v-if=\"isShow\" class=\"box\">\u003C\u002Fdiv>\n \u003Cdiv v-else class=\"box1\">\u003C\u002Fdiv>\n \u003C\u002Ftransition>\n\u003C\u002Ftemplate>\n\n\u003Cscript>\nexport default {\n name: \"03_transition\",\n data() {\n return {\n isShow: true\n }\n }\n}\n\u003C\u002Fscript>\n\n\u003Cstyle scoped>\n.box {\n width: 200px;\n height: 150px;\n background-color: pink;\n}\n\n.box1 {\n width: 200px;\n height: 150px;\n background-color: blue;\n}\n\n.fade-enter-from {\n opacity: 1;\n transform: translateX(200px);\n}\n\n.fade-enter-to {\n opacity: 0;\n transform: translateX(0);\n}\n\n.fade-enter-active {\n transition: 2s;\n}\n\n.fade-leave-from {\n opacity: 1;\n transform: translateX(0);\n}\n\n.fade-leave-to {\n opacity: 0;\n transform: translateX(200px);\n}\n\n.fade-leave-active {\n transition: 1s;\n}\n\n\u003C\u002Fstyle>\n",[4406],{"type":17,"tag":32,"props":4407,"children":4408},{"__ignoreMap":7},[4409,4424,4448,4511,4519,4562,4619,4660,4675,4690,4697,4712,4727,4743,4754,4765,4778,4785,4792,4799,4814,4821,4840,4852,4877,4901,4921,4928,4935,4947,4970,4993,5013,5020,5028,5041,5062,5096,5104,5112,5125,5145,5173,5181,5189,5202,5229,5237,5245,5258,5278,5306,5314,5322,5335,5355,5387,5395,5403,5416,5440,5448,5456],{"type":17,"tag":36,"props":4410,"children":4411},{"class":38,"line":39},[4412,4416,4420],{"type":17,"tag":36,"props":4413,"children":4414},{"style":80},[4415],{"type":23,"value":528},{"type":17,"tag":36,"props":4417,"children":4418},{"style":86},[4419],{"type":23,"value":777},{"type":17,"tag":36,"props":4421,"children":4422},{"style":80},[4423],{"type":23,"value":543},{"type":17,"tag":36,"props":4425,"children":4426},{"class":38,"line":48},[4427,4431,4435,4440,4444],{"type":17,"tag":36,"props":4428,"children":4429},{"style":80},[4430],{"type":23,"value":789},{"type":17,"tag":36,"props":4432,"children":4433},{"style":86},[4434],{"type":23,"value":61},{"type":17,"tag":36,"props":4436,"children":4437},{"style":80},[4438],{"type":23,"value":4439},">transition\u003C\u002F",{"type":17,"tag":36,"props":4441,"children":4442},{"style":86},[4443],{"type":23,"value":61},{"type":17,"tag":36,"props":4445,"children":4446},{"style":80},[4447],{"type":23,"value":543},{"type":17,"tag":36,"props":4449,"children":4450},{"class":38,"line":115},[4451,4455,4459,4463,4467,4471,4475,4480,4484,4489,4494,4498,4503,4507],{"type":17,"tag":36,"props":4452,"children":4453},{"style":80},[4454],{"type":23,"value":789},{"type":17,"tag":36,"props":4456,"children":4457},{"style":86},[4458],{"type":23,"value":3739},{"type":17,"tag":36,"props":4460,"children":4461},{"style":80},[4462],{"type":23,"value":916},{"type":17,"tag":36,"props":4464,"children":4465},{"style":411},[4466],{"type":23,"value":921},{"type":17,"tag":36,"props":4468,"children":4469},{"style":80},[4470],{"type":23,"value":482},{"type":17,"tag":36,"props":4472,"children":4473},{"style":422},[4474],{"type":23,"value":842},{"type":17,"tag":36,"props":4476,"children":4477},{"style":80},[4478],{"type":23,"value":4479},"isShow ",{"type":17,"tag":36,"props":4481,"children":4482},{"style":395},[4483],{"type":23,"value":482},{"type":17,"tag":36,"props":4485,"children":4486},{"style":395},[4487],{"type":23,"value":4488}," !",{"type":17,"tag":36,"props":4490,"children":4491},{"style":80},[4492],{"type":23,"value":4493},"isShow",{"type":17,"tag":36,"props":4495,"children":4496},{"style":422},[4497],{"type":23,"value":842},{"type":17,"tag":36,"props":4499,"children":4500},{"style":80},[4501],{"type":23,"value":4502},">点击切换状态\u003C\u002F",{"type":17,"tag":36,"props":4504,"children":4505},{"style":86},[4506],{"type":23,"value":3739},{"type":17,"tag":36,"props":4508,"children":4509},{"style":80},[4510],{"type":23,"value":543},{"type":17,"tag":36,"props":4512,"children":4513},{"class":38,"line":133},[4514],{"type":17,"tag":36,"props":4515,"children":4516},{"style":1805},[4517],{"type":23,"value":4518}," \u003C!-- 先进后出 -->\n",{"type":17,"tag":36,"props":4520,"children":4521},{"class":38,"line":157},[4522,4526,4531,4535,4539,4544,4549,4553,4558],{"type":17,"tag":36,"props":4523,"children":4524},{"style":80},[4525],{"type":23,"value":789},{"type":17,"tag":36,"props":4527,"children":4528},{"style":86},[4529],{"type":23,"value":4530},"transition",{"type":17,"tag":36,"props":4532,"children":4533},{"style":411},[4534],{"type":23,"value":2809},{"type":17,"tag":36,"props":4536,"children":4537},{"style":80},[4538],{"type":23,"value":482},{"type":17,"tag":36,"props":4540,"children":4541},{"style":422},[4542],{"type":23,"value":4543},"\"fade\"",{"type":17,"tag":36,"props":4545,"children":4546},{"style":411},[4547],{"type":23,"value":4548}," mode",{"type":17,"tag":36,"props":4550,"children":4551},{"style":80},[4552],{"type":23,"value":482},{"type":17,"tag":36,"props":4554,"children":4555},{"style":422},[4556],{"type":23,"value":4557},"\"out-in\"",{"type":17,"tag":36,"props":4559,"children":4560},{"style":80},[4561],{"type":23,"value":543},{"type":17,"tag":36,"props":4563,"children":4564},{"class":38,"line":180},[4565,4569,4573,4578,4582,4586,4590,4594,4598,4602,4607,4611,4615],{"type":17,"tag":36,"props":4566,"children":4567},{"style":80},[4568],{"type":23,"value":821},{"type":17,"tag":36,"props":4570,"children":4571},{"style":86},[4572],{"type":23,"value":794},{"type":17,"tag":36,"props":4574,"children":4575},{"style":395},[4576],{"type":23,"value":4577}," v-if",{"type":17,"tag":36,"props":4579,"children":4580},{"style":80},[4581],{"type":23,"value":482},{"type":17,"tag":36,"props":4583,"children":4584},{"style":422},[4585],{"type":23,"value":842},{"type":17,"tag":36,"props":4587,"children":4588},{"style":80},[4589],{"type":23,"value":4493},{"type":17,"tag":36,"props":4591,"children":4592},{"style":422},[4593],{"type":23,"value":842},{"type":17,"tag":36,"props":4595,"children":4596},{"style":411},[4597],{"type":23,"value":799},{"type":17,"tag":36,"props":4599,"children":4600},{"style":80},[4601],{"type":23,"value":482},{"type":17,"tag":36,"props":4603,"children":4604},{"style":422},[4605],{"type":23,"value":4606},"\"box\"",{"type":17,"tag":36,"props":4608,"children":4609},{"style":80},[4610],{"type":23,"value":1680},{"type":17,"tag":36,"props":4612,"children":4613},{"style":86},[4614],{"type":23,"value":794},{"type":17,"tag":36,"props":4616,"children":4617},{"style":80},[4618],{"type":23,"value":543},{"type":17,"tag":36,"props":4620,"children":4621},{"class":38,"line":202},[4622,4626,4630,4635,4639,4643,4648,4652,4656],{"type":17,"tag":36,"props":4623,"children":4624},{"style":80},[4625],{"type":23,"value":821},{"type":17,"tag":36,"props":4627,"children":4628},{"style":86},[4629],{"type":23,"value":794},{"type":17,"tag":36,"props":4631,"children":4632},{"style":395},[4633],{"type":23,"value":4634}," v-else",{"type":17,"tag":36,"props":4636,"children":4637},{"style":411},[4638],{"type":23,"value":799},{"type":17,"tag":36,"props":4640,"children":4641},{"style":80},[4642],{"type":23,"value":482},{"type":17,"tag":36,"props":4644,"children":4645},{"style":422},[4646],{"type":23,"value":4647},"\"box1\"",{"type":17,"tag":36,"props":4649,"children":4650},{"style":80},[4651],{"type":23,"value":1680},{"type":17,"tag":36,"props":4653,"children":4654},{"style":86},[4655],{"type":23,"value":794},{"type":17,"tag":36,"props":4657,"children":4658},{"style":80},[4659],{"type":23,"value":543},{"type":17,"tag":36,"props":4661,"children":4662},{"class":38,"line":224},[4663,4667,4671],{"type":17,"tag":36,"props":4664,"children":4665},{"style":80},[4666],{"type":23,"value":960},{"type":17,"tag":36,"props":4668,"children":4669},{"style":86},[4670],{"type":23,"value":4530},{"type":17,"tag":36,"props":4672,"children":4673},{"style":80},[4674],{"type":23,"value":543},{"type":17,"tag":36,"props":4676,"children":4677},{"class":38,"line":246},[4678,4682,4686],{"type":17,"tag":36,"props":4679,"children":4680},{"style":80},[4681],{"type":23,"value":750},{"type":17,"tag":36,"props":4683,"children":4684},{"style":86},[4685],{"type":23,"value":777},{"type":17,"tag":36,"props":4687,"children":4688},{"style":80},[4689],{"type":23,"value":543},{"type":17,"tag":36,"props":4691,"children":4692},{"class":38,"line":267},[4693],{"type":17,"tag":36,"props":4694,"children":4695},{"emptyLinePlaceholder":617},[4696],{"type":23,"value":620},{"type":17,"tag":36,"props":4698,"children":4699},{"class":38,"line":276},[4700,4704,4708],{"type":17,"tag":36,"props":4701,"children":4702},{"style":80},[4703],{"type":23,"value":528},{"type":17,"tag":36,"props":4705,"children":4706},{"style":86},[4707],{"type":23,"value":533},{"type":17,"tag":36,"props":4709,"children":4710},{"style":80},[4711],{"type":23,"value":543},{"type":17,"tag":36,"props":4713,"children":4714},{"class":38,"line":285},[4715,4719,4723],{"type":17,"tag":36,"props":4716,"children":4717},{"style":395},[4718],{"type":23,"value":3282},{"type":17,"tag":36,"props":4720,"children":4721},{"style":395},[4722],{"type":23,"value":3287},{"type":17,"tag":36,"props":4724,"children":4725},{"style":80},[4726],{"type":23,"value":94},{"type":17,"tag":36,"props":4728,"children":4729},{"class":38,"line":815},[4730,4734,4739],{"type":17,"tag":36,"props":4731,"children":4732},{"style":80},[4733],{"type":23,"value":3299},{"type":17,"tag":36,"props":4735,"children":4736},{"style":422},[4737],{"type":23,"value":4738},"\"03_transition\"",{"type":17,"tag":36,"props":4740,"children":4741},{"style":80},[4742],{"type":23,"value":3309},{"type":17,"tag":36,"props":4744,"children":4745},{"class":38,"line":954},[4746,4750],{"type":17,"tag":36,"props":4747,"children":4748},{"style":411},[4749],{"type":23,"value":3317},{"type":17,"tag":36,"props":4751,"children":4752},{"style":80},[4753],{"type":23,"value":638},{"type":17,"tag":36,"props":4755,"children":4756},{"class":38,"line":971},[4757,4761],{"type":17,"tag":36,"props":4758,"children":4759},{"style":395},[4760],{"type":23,"value":3329},{"type":17,"tag":36,"props":4762,"children":4763},{"style":80},[4764],{"type":23,"value":94},{"type":17,"tag":36,"props":4766,"children":4767},{"class":38,"line":2770},[4768,4773],{"type":17,"tag":36,"props":4769,"children":4770},{"style":80},[4771],{"type":23,"value":4772}," isShow: ",{"type":17,"tag":36,"props":4774,"children":4775},{"style":105},[4776],{"type":23,"value":4777},"true\n",{"type":17,"tag":36,"props":4779,"children":4780},{"class":38,"line":2778},[4781],{"type":17,"tag":36,"props":4782,"children":4783},{"style":80},[4784],{"type":23,"value":273},{"type":17,"tag":36,"props":4786,"children":4787},{"class":38,"line":2794},[4788],{"type":17,"tag":36,"props":4789,"children":4790},{"style":80},[4791],{"type":23,"value":282},{"type":17,"tag":36,"props":4793,"children":4794},{"class":38,"line":2830},[4795],{"type":17,"tag":36,"props":4796,"children":4797},{"style":80},[4798],{"type":23,"value":291},{"type":17,"tag":36,"props":4800,"children":4801},{"class":38,"line":2863},[4802,4806,4810],{"type":17,"tag":36,"props":4803,"children":4804},{"style":80},[4805],{"type":23,"value":750},{"type":17,"tag":36,"props":4807,"children":4808},{"style":86},[4809],{"type":23,"value":533},{"type":17,"tag":36,"props":4811,"children":4812},{"style":80},[4813],{"type":23,"value":543},{"type":17,"tag":36,"props":4815,"children":4816},{"class":38,"line":3058},[4817],{"type":17,"tag":36,"props":4818,"children":4819},{"emptyLinePlaceholder":617},[4820],{"type":23,"value":620},{"type":17,"tag":36,"props":4822,"children":4823},{"class":38,"line":3067},[4824,4828,4832,4836],{"type":17,"tag":36,"props":4825,"children":4826},{"style":80},[4827],{"type":23,"value":528},{"type":17,"tag":36,"props":4829,"children":4830},{"style":86},[4831],{"type":23,"value":505},{"type":17,"tag":36,"props":4833,"children":4834},{"style":411},[4835],{"type":23,"value":3635},{"type":17,"tag":36,"props":4837,"children":4838},{"style":80},[4839],{"type":23,"value":543},{"type":17,"tag":36,"props":4841,"children":4842},{"class":38,"line":3085},[4843,4848],{"type":17,"tag":36,"props":4844,"children":4845},{"style":411},[4846],{"type":23,"value":4847},".box",{"type":17,"tag":36,"props":4849,"children":4850},{"style":80},[4851],{"type":23,"value":94},{"type":17,"tag":36,"props":4853,"children":4854},{"class":38,"line":3094},[4855,4860,4864,4869,4873],{"type":17,"tag":36,"props":4856,"children":4857},{"style":105},[4858],{"type":23,"value":4859}," width",{"type":17,"tag":36,"props":4861,"children":4862},{"style":80},[4863],{"type":23,"value":144},{"type":17,"tag":36,"props":4865,"children":4866},{"style":105},[4867],{"type":23,"value":4868},"200",{"type":17,"tag":36,"props":4870,"children":4871},{"style":395},[4872],{"type":23,"value":907},{"type":17,"tag":36,"props":4874,"children":4875},{"style":80},[4876],{"type":23,"value":177},{"type":17,"tag":36,"props":4878,"children":4879},{"class":38,"line":3103},[4880,4885,4889,4893,4897],{"type":17,"tag":36,"props":4881,"children":4882},{"style":105},[4883],{"type":23,"value":4884}," height",{"type":17,"tag":36,"props":4886,"children":4887},{"style":80},[4888],{"type":23,"value":144},{"type":17,"tag":36,"props":4890,"children":4891},{"style":105},[4892],{"type":23,"value":149},{"type":17,"tag":36,"props":4894,"children":4895},{"style":395},[4896],{"type":23,"value":907},{"type":17,"tag":36,"props":4898,"children":4899},{"style":80},[4900],{"type":23,"value":177},{"type":17,"tag":36,"props":4902,"children":4903},{"class":38,"line":3120},[4904,4908,4912,4917],{"type":17,"tag":36,"props":4905,"children":4906},{"style":105},[4907],{"type":23,"value":2293},{"type":17,"tag":36,"props":4909,"children":4910},{"style":80},[4911],{"type":23,"value":144},{"type":17,"tag":36,"props":4913,"children":4914},{"style":105},[4915],{"type":23,"value":4916},"pink",{"type":17,"tag":36,"props":4918,"children":4919},{"style":80},[4920],{"type":23,"value":177},{"type":17,"tag":36,"props":4922,"children":4923},{"class":38,"line":3129},[4924],{"type":17,"tag":36,"props":4925,"children":4926},{"style":80},[4927],{"type":23,"value":291},{"type":17,"tag":36,"props":4929,"children":4930},{"class":38,"line":3589},[4931],{"type":17,"tag":36,"props":4932,"children":4933},{"emptyLinePlaceholder":617},[4934],{"type":23,"value":620},{"type":17,"tag":36,"props":4936,"children":4937},{"class":38,"line":3597},[4938,4943],{"type":17,"tag":36,"props":4939,"children":4940},{"style":411},[4941],{"type":23,"value":4942},".box1",{"type":17,"tag":36,"props":4944,"children":4945},{"style":80},[4946],{"type":23,"value":94},{"type":17,"tag":36,"props":4948,"children":4949},{"class":38,"line":3613},[4950,4954,4958,4962,4966],{"type":17,"tag":36,"props":4951,"children":4952},{"style":105},[4953],{"type":23,"value":4859},{"type":17,"tag":36,"props":4955,"children":4956},{"style":80},[4957],{"type":23,"value":144},{"type":17,"tag":36,"props":4959,"children":4960},{"style":105},[4961],{"type":23,"value":4868},{"type":17,"tag":36,"props":4963,"children":4964},{"style":395},[4965],{"type":23,"value":907},{"type":17,"tag":36,"props":4967,"children":4968},{"style":80},[4969],{"type":23,"value":177},{"type":17,"tag":36,"props":4971,"children":4972},{"class":38,"line":3621},[4973,4977,4981,4985,4989],{"type":17,"tag":36,"props":4974,"children":4975},{"style":105},[4976],{"type":23,"value":4884},{"type":17,"tag":36,"props":4978,"children":4979},{"style":80},[4980],{"type":23,"value":144},{"type":17,"tag":36,"props":4982,"children":4983},{"style":105},[4984],{"type":23,"value":149},{"type":17,"tag":36,"props":4986,"children":4987},{"style":395},[4988],{"type":23,"value":907},{"type":17,"tag":36,"props":4990,"children":4991},{"style":80},[4992],{"type":23,"value":177},{"type":17,"tag":36,"props":4994,"children":4995},{"class":38,"line":3642},[4996,5000,5004,5009],{"type":17,"tag":36,"props":4997,"children":4998},{"style":105},[4999],{"type":23,"value":2293},{"type":17,"tag":36,"props":5001,"children":5002},{"style":80},[5003],{"type":23,"value":144},{"type":17,"tag":36,"props":5005,"children":5006},{"style":105},[5007],{"type":23,"value":5008},"blue",{"type":17,"tag":36,"props":5010,"children":5011},{"style":80},[5012],{"type":23,"value":177},{"type":17,"tag":36,"props":5014,"children":5015},{"class":38,"line":3650},[5016],{"type":17,"tag":36,"props":5017,"children":5018},{"style":80},[5019],{"type":23,"value":291},{"type":17,"tag":36,"props":5021,"children":5023},{"class":38,"line":5022},34,[5024],{"type":17,"tag":36,"props":5025,"children":5026},{"emptyLinePlaceholder":617},[5027],{"type":23,"value":620},{"type":17,"tag":36,"props":5029,"children":5031},{"class":38,"line":5030},35,[5032,5037],{"type":17,"tag":36,"props":5033,"children":5034},{"style":411},[5035],{"type":23,"value":5036},".fade-enter-from",{"type":17,"tag":36,"props":5038,"children":5039},{"style":80},[5040],{"type":23,"value":94},{"type":17,"tag":36,"props":5042,"children":5044},{"class":38,"line":5043},36,[5045,5050,5054,5058],{"type":17,"tag":36,"props":5046,"children":5047},{"style":105},[5048],{"type":23,"value":5049}," opacity",{"type":17,"tag":36,"props":5051,"children":5052},{"style":80},[5053],{"type":23,"value":144},{"type":17,"tag":36,"props":5055,"children":5056},{"style":105},[5057],{"type":23,"value":1297},{"type":17,"tag":36,"props":5059,"children":5060},{"style":80},[5061],{"type":23,"value":177},{"type":17,"tag":36,"props":5063,"children":5065},{"class":38,"line":5064},37,[5066,5071,5075,5080,5084,5088,5092],{"type":17,"tag":36,"props":5067,"children":5068},{"style":105},[5069],{"type":23,"value":5070}," transform",{"type":17,"tag":36,"props":5072,"children":5073},{"style":80},[5074],{"type":23,"value":144},{"type":17,"tag":36,"props":5076,"children":5077},{"style":105},[5078],{"type":23,"value":5079},"translateX",{"type":17,"tag":36,"props":5081,"children":5082},{"style":80},[5083],{"type":23,"value":419},{"type":17,"tag":36,"props":5085,"children":5086},{"style":105},[5087],{"type":23,"value":4868},{"type":17,"tag":36,"props":5089,"children":5090},{"style":395},[5091],{"type":23,"value":907},{"type":17,"tag":36,"props":5093,"children":5094},{"style":80},[5095],{"type":23,"value":578},{"type":17,"tag":36,"props":5097,"children":5099},{"class":38,"line":5098},38,[5100],{"type":17,"tag":36,"props":5101,"children":5102},{"style":80},[5103],{"type":23,"value":291},{"type":17,"tag":36,"props":5105,"children":5107},{"class":38,"line":5106},39,[5108],{"type":17,"tag":36,"props":5109,"children":5110},{"emptyLinePlaceholder":617},[5111],{"type":23,"value":620},{"type":17,"tag":36,"props":5113,"children":5115},{"class":38,"line":5114},40,[5116,5121],{"type":17,"tag":36,"props":5117,"children":5118},{"style":411},[5119],{"type":23,"value":5120},".fade-enter-to",{"type":17,"tag":36,"props":5122,"children":5123},{"style":80},[5124],{"type":23,"value":94},{"type":17,"tag":36,"props":5126,"children":5128},{"class":38,"line":5127},41,[5129,5133,5137,5141],{"type":17,"tag":36,"props":5130,"children":5131},{"style":105},[5132],{"type":23,"value":5049},{"type":17,"tag":36,"props":5134,"children":5135},{"style":80},[5136],{"type":23,"value":144},{"type":17,"tag":36,"props":5138,"children":5139},{"style":105},[5140],{"type":23,"value":217},{"type":17,"tag":36,"props":5142,"children":5143},{"style":80},[5144],{"type":23,"value":177},{"type":17,"tag":36,"props":5146,"children":5148},{"class":38,"line":5147},42,[5149,5153,5157,5161,5165,5169],{"type":17,"tag":36,"props":5150,"children":5151},{"style":105},[5152],{"type":23,"value":5070},{"type":17,"tag":36,"props":5154,"children":5155},{"style":80},[5156],{"type":23,"value":144},{"type":17,"tag":36,"props":5158,"children":5159},{"style":105},[5160],{"type":23,"value":5079},{"type":17,"tag":36,"props":5162,"children":5163},{"style":80},[5164],{"type":23,"value":419},{"type":17,"tag":36,"props":5166,"children":5167},{"style":105},[5168],{"type":23,"value":217},{"type":17,"tag":36,"props":5170,"children":5171},{"style":80},[5172],{"type":23,"value":578},{"type":17,"tag":36,"props":5174,"children":5176},{"class":38,"line":5175},43,[5177],{"type":17,"tag":36,"props":5178,"children":5179},{"style":80},[5180],{"type":23,"value":291},{"type":17,"tag":36,"props":5182,"children":5184},{"class":38,"line":5183},44,[5185],{"type":17,"tag":36,"props":5186,"children":5187},{"emptyLinePlaceholder":617},[5188],{"type":23,"value":620},{"type":17,"tag":36,"props":5190,"children":5192},{"class":38,"line":5191},45,[5193,5198],{"type":17,"tag":36,"props":5194,"children":5195},{"style":411},[5196],{"type":23,"value":5197},".fade-enter-active",{"type":17,"tag":36,"props":5199,"children":5200},{"style":80},[5201],{"type":23,"value":94},{"type":17,"tag":36,"props":5203,"children":5205},{"class":38,"line":5204},46,[5206,5211,5215,5220,5225],{"type":17,"tag":36,"props":5207,"children":5208},{"style":105},[5209],{"type":23,"value":5210}," transition",{"type":17,"tag":36,"props":5212,"children":5213},{"style":80},[5214],{"type":23,"value":144},{"type":17,"tag":36,"props":5216,"children":5217},{"style":105},[5218],{"type":23,"value":5219},"2",{"type":17,"tag":36,"props":5221,"children":5222},{"style":395},[5223],{"type":23,"value":5224},"s",{"type":17,"tag":36,"props":5226,"children":5227},{"style":80},[5228],{"type":23,"value":177},{"type":17,"tag":36,"props":5230,"children":5232},{"class":38,"line":5231},47,[5233],{"type":17,"tag":36,"props":5234,"children":5235},{"style":80},[5236],{"type":23,"value":291},{"type":17,"tag":36,"props":5238,"children":5240},{"class":38,"line":5239},48,[5241],{"type":17,"tag":36,"props":5242,"children":5243},{"emptyLinePlaceholder":617},[5244],{"type":23,"value":620},{"type":17,"tag":36,"props":5246,"children":5248},{"class":38,"line":5247},49,[5249,5254],{"type":17,"tag":36,"props":5250,"children":5251},{"style":411},[5252],{"type":23,"value":5253},".fade-leave-from",{"type":17,"tag":36,"props":5255,"children":5256},{"style":80},[5257],{"type":23,"value":94},{"type":17,"tag":36,"props":5259,"children":5261},{"class":38,"line":5260},50,[5262,5266,5270,5274],{"type":17,"tag":36,"props":5263,"children":5264},{"style":105},[5265],{"type":23,"value":5049},{"type":17,"tag":36,"props":5267,"children":5268},{"style":80},[5269],{"type":23,"value":144},{"type":17,"tag":36,"props":5271,"children":5272},{"style":105},[5273],{"type":23,"value":1297},{"type":17,"tag":36,"props":5275,"children":5276},{"style":80},[5277],{"type":23,"value":177},{"type":17,"tag":36,"props":5279,"children":5281},{"class":38,"line":5280},51,[5282,5286,5290,5294,5298,5302],{"type":17,"tag":36,"props":5283,"children":5284},{"style":105},[5285],{"type":23,"value":5070},{"type":17,"tag":36,"props":5287,"children":5288},{"style":80},[5289],{"type":23,"value":144},{"type":17,"tag":36,"props":5291,"children":5292},{"style":105},[5293],{"type":23,"value":5079},{"type":17,"tag":36,"props":5295,"children":5296},{"style":80},[5297],{"type":23,"value":419},{"type":17,"tag":36,"props":5299,"children":5300},{"style":105},[5301],{"type":23,"value":217},{"type":17,"tag":36,"props":5303,"children":5304},{"style":80},[5305],{"type":23,"value":578},{"type":17,"tag":36,"props":5307,"children":5309},{"class":38,"line":5308},52,[5310],{"type":17,"tag":36,"props":5311,"children":5312},{"style":80},[5313],{"type":23,"value":291},{"type":17,"tag":36,"props":5315,"children":5317},{"class":38,"line":5316},53,[5318],{"type":17,"tag":36,"props":5319,"children":5320},{"emptyLinePlaceholder":617},[5321],{"type":23,"value":620},{"type":17,"tag":36,"props":5323,"children":5325},{"class":38,"line":5324},54,[5326,5331],{"type":17,"tag":36,"props":5327,"children":5328},{"style":411},[5329],{"type":23,"value":5330},".fade-leave-to",{"type":17,"tag":36,"props":5332,"children":5333},{"style":80},[5334],{"type":23,"value":94},{"type":17,"tag":36,"props":5336,"children":5338},{"class":38,"line":5337},55,[5339,5343,5347,5351],{"type":17,"tag":36,"props":5340,"children":5341},{"style":105},[5342],{"type":23,"value":5049},{"type":17,"tag":36,"props":5344,"children":5345},{"style":80},[5346],{"type":23,"value":144},{"type":17,"tag":36,"props":5348,"children":5349},{"style":105},[5350],{"type":23,"value":217},{"type":17,"tag":36,"props":5352,"children":5353},{"style":80},[5354],{"type":23,"value":177},{"type":17,"tag":36,"props":5356,"children":5358},{"class":38,"line":5357},56,[5359,5363,5367,5371,5375,5379,5383],{"type":17,"tag":36,"props":5360,"children":5361},{"style":105},[5362],{"type":23,"value":5070},{"type":17,"tag":36,"props":5364,"children":5365},{"style":80},[5366],{"type":23,"value":144},{"type":17,"tag":36,"props":5368,"children":5369},{"style":105},[5370],{"type":23,"value":5079},{"type":17,"tag":36,"props":5372,"children":5373},{"style":80},[5374],{"type":23,"value":419},{"type":17,"tag":36,"props":5376,"children":5377},{"style":105},[5378],{"type":23,"value":4868},{"type":17,"tag":36,"props":5380,"children":5381},{"style":395},[5382],{"type":23,"value":907},{"type":17,"tag":36,"props":5384,"children":5385},{"style":80},[5386],{"type":23,"value":578},{"type":17,"tag":36,"props":5388,"children":5390},{"class":38,"line":5389},57,[5391],{"type":17,"tag":36,"props":5392,"children":5393},{"style":80},[5394],{"type":23,"value":291},{"type":17,"tag":36,"props":5396,"children":5398},{"class":38,"line":5397},58,[5399],{"type":17,"tag":36,"props":5400,"children":5401},{"emptyLinePlaceholder":617},[5402],{"type":23,"value":620},{"type":17,"tag":36,"props":5404,"children":5406},{"class":38,"line":5405},59,[5407,5412],{"type":17,"tag":36,"props":5408,"children":5409},{"style":411},[5410],{"type":23,"value":5411},".fade-leave-active",{"type":17,"tag":36,"props":5413,"children":5414},{"style":80},[5415],{"type":23,"value":94},{"type":17,"tag":36,"props":5417,"children":5419},{"class":38,"line":5418},60,[5420,5424,5428,5432,5436],{"type":17,"tag":36,"props":5421,"children":5422},{"style":105},[5423],{"type":23,"value":5210},{"type":17,"tag":36,"props":5425,"children":5426},{"style":80},[5427],{"type":23,"value":144},{"type":17,"tag":36,"props":5429,"children":5430},{"style":105},[5431],{"type":23,"value":1297},{"type":17,"tag":36,"props":5433,"children":5434},{"style":395},[5435],{"type":23,"value":5224},{"type":17,"tag":36,"props":5437,"children":5438},{"style":80},[5439],{"type":23,"value":177},{"type":17,"tag":36,"props":5441,"children":5443},{"class":38,"line":5442},61,[5444],{"type":17,"tag":36,"props":5445,"children":5446},{"style":80},[5447],{"type":23,"value":291},{"type":17,"tag":36,"props":5449,"children":5451},{"class":38,"line":5450},62,[5452],{"type":17,"tag":36,"props":5453,"children":5454},{"emptyLinePlaceholder":617},[5455],{"type":23,"value":620},{"type":17,"tag":36,"props":5457,"children":5459},{"class":38,"line":5458},63,[5460,5464,5468],{"type":17,"tag":36,"props":5461,"children":5462},{"style":80},[5463],{"type":23,"value":750},{"type":17,"tag":36,"props":5465,"children":5466},{"style":86},[5467],{"type":23,"value":505},{"type":17,"tag":36,"props":5469,"children":5470},{"style":80},[5471],{"type":23,"value":543},{"type":17,"tag":304,"props":5473,"children":5475},{"id":5474},"component组件与keep-alive组件缓存",[5476],{"type":23,"value":5474},{"type":17,"tag":368,"props":5478,"children":5479},{},[5480,5485],{"type":17,"tag":323,"props":5481,"children":5482},{},[5483],{"type":23,"value":5484},"渲染一个「元组件」为动态组件。依is的值，来决定哪个组件被渲染",{"type":17,"tag":323,"props":5486,"children":5487},{},[5488],{"type":23,"value":5489},"keep-alive 可以让动态组件保持状态，切出去再切回来，保持之前的状态",{"type":17,"tag":25,"props":5491,"children":5493},{"className":339,"code":5492,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Cdiv>\n \u003Ch2>动态组件\u003C\u002Fh2>\n \u003Cbutton @click=\"nowCom = 'MyCom1'\">com1\u003C\u002Fbutton>\n \u003Cbutton @click=\"nowCom = 'MyCom2'\">com2\u003C\u002Fbutton>\n \u003Cbutton @click=\"nowCom = 'MyCom3'\">com3\u003C\u002Fbutton>\n \u003Ckeep-alive>\n \u003Ccomponent :is=\"nowCom\">\u003C\u002Fcomponent>\n \u003C\u002Fkeep-alive>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript>\nimport MyCom1 from '..\u002Fcomponents\u002FMyCom1.vue'\nimport MyCom2 from '..\u002Fcomponents\u002FMyCom2.vue'\nimport MyCom3 from '..\u002Fcomponents\u002FMyCom3.vue'\n\nexport default {\n name: \"04_动态组件\",\n data() {\n return {\n nowCom: 'MyCom1'\n }\n },\n components: {\n MyCom1,\n MyCom2,\n MyCom3\n }\n}\n\u003C\u002Fscript>\n\n\u003Cstyle scoped>\n\n\u003C\u002Fstyle>\n",[5494],{"type":17,"tag":32,"props":5495,"children":5496},{"__ignoreMap":7},[5497,5512,5527,5551,5605,5658,5711,5727,5777,5793,5808,5823,5830,5845,5866,5887,5908,5915,5930,5946,5957,5968,5981,5988,5995,6003,6011,6019,6027,6034,6041,6056,6063,6082,6089],{"type":17,"tag":36,"props":5498,"children":5499},{"class":38,"line":39},[5500,5504,5508],{"type":17,"tag":36,"props":5501,"children":5502},{"style":80},[5503],{"type":23,"value":528},{"type":17,"tag":36,"props":5505,"children":5506},{"style":86},[5507],{"type":23,"value":777},{"type":17,"tag":36,"props":5509,"children":5510},{"style":80},[5511],{"type":23,"value":543},{"type":17,"tag":36,"props":5513,"children":5514},{"class":38,"line":48},[5515,5519,5523],{"type":17,"tag":36,"props":5516,"children":5517},{"style":80},[5518],{"type":23,"value":789},{"type":17,"tag":36,"props":5520,"children":5521},{"style":86},[5522],{"type":23,"value":794},{"type":17,"tag":36,"props":5524,"children":5525},{"style":80},[5526],{"type":23,"value":543},{"type":17,"tag":36,"props":5528,"children":5529},{"class":38,"line":115},[5530,5534,5538,5543,5547],{"type":17,"tag":36,"props":5531,"children":5532},{"style":80},[5533],{"type":23,"value":821},{"type":17,"tag":36,"props":5535,"children":5536},{"style":86},[5537],{"type":23,"value":61},{"type":17,"tag":36,"props":5539,"children":5540},{"style":80},[5541],{"type":23,"value":5542},">动态组件\u003C\u002F",{"type":17,"tag":36,"props":5544,"children":5545},{"style":86},[5546],{"type":23,"value":61},{"type":17,"tag":36,"props":5548,"children":5549},{"style":80},[5550],{"type":23,"value":543},{"type":17,"tag":36,"props":5552,"children":5553},{"class":38,"line":133},[5554,5558,5562,5566,5570,5574,5578,5583,5587,5592,5597,5601],{"type":17,"tag":36,"props":5555,"children":5556},{"style":80},[5557],{"type":23,"value":821},{"type":17,"tag":36,"props":5559,"children":5560},{"style":86},[5561],{"type":23,"value":3739},{"type":17,"tag":36,"props":5563,"children":5564},{"style":80},[5565],{"type":23,"value":916},{"type":17,"tag":36,"props":5567,"children":5568},{"style":411},[5569],{"type":23,"value":921},{"type":17,"tag":36,"props":5571,"children":5572},{"style":80},[5573],{"type":23,"value":482},{"type":17,"tag":36,"props":5575,"children":5576},{"style":422},[5577],{"type":23,"value":842},{"type":17,"tag":36,"props":5579,"children":5580},{"style":80},[5581],{"type":23,"value":5582},"nowCom ",{"type":17,"tag":36,"props":5584,"children":5585},{"style":395},[5586],{"type":23,"value":482},{"type":17,"tag":36,"props":5588,"children":5589},{"style":422},[5590],{"type":23,"value":5591}," 'MyCom1'\"",{"type":17,"tag":36,"props":5593,"children":5594},{"style":80},[5595],{"type":23,"value":5596},">com1\u003C\u002F",{"type":17,"tag":36,"props":5598,"children":5599},{"style":86},[5600],{"type":23,"value":3739},{"type":17,"tag":36,"props":5602,"children":5603},{"style":80},[5604],{"type":23,"value":543},{"type":17,"tag":36,"props":5606,"children":5607},{"class":38,"line":157},[5608,5612,5616,5620,5624,5628,5632,5636,5640,5645,5650,5654],{"type":17,"tag":36,"props":5609,"children":5610},{"style":80},[5611],{"type":23,"value":821},{"type":17,"tag":36,"props":5613,"children":5614},{"style":86},[5615],{"type":23,"value":3739},{"type":17,"tag":36,"props":5617,"children":5618},{"style":80},[5619],{"type":23,"value":916},{"type":17,"tag":36,"props":5621,"children":5622},{"style":411},[5623],{"type":23,"value":921},{"type":17,"tag":36,"props":5625,"children":5626},{"style":80},[5627],{"type":23,"value":482},{"type":17,"tag":36,"props":5629,"children":5630},{"style":422},[5631],{"type":23,"value":842},{"type":17,"tag":36,"props":5633,"children":5634},{"style":80},[5635],{"type":23,"value":5582},{"type":17,"tag":36,"props":5637,"children":5638},{"style":395},[5639],{"type":23,"value":482},{"type":17,"tag":36,"props":5641,"children":5642},{"style":422},[5643],{"type":23,"value":5644}," 'MyCom2'\"",{"type":17,"tag":36,"props":5646,"children":5647},{"style":80},[5648],{"type":23,"value":5649},">com2\u003C\u002F",{"type":17,"tag":36,"props":5651,"children":5652},{"style":86},[5653],{"type":23,"value":3739},{"type":17,"tag":36,"props":5655,"children":5656},{"style":80},[5657],{"type":23,"value":543},{"type":17,"tag":36,"props":5659,"children":5660},{"class":38,"line":180},[5661,5665,5669,5673,5677,5681,5685,5689,5693,5698,5703,5707],{"type":17,"tag":36,"props":5662,"children":5663},{"style":80},[5664],{"type":23,"value":821},{"type":17,"tag":36,"props":5666,"children":5667},{"style":86},[5668],{"type":23,"value":3739},{"type":17,"tag":36,"props":5670,"children":5671},{"style":80},[5672],{"type":23,"value":916},{"type":17,"tag":36,"props":5674,"children":5675},{"style":411},[5676],{"type":23,"value":921},{"type":17,"tag":36,"props":5678,"children":5679},{"style":80},[5680],{"type":23,"value":482},{"type":17,"tag":36,"props":5682,"children":5683},{"style":422},[5684],{"type":23,"value":842},{"type":17,"tag":36,"props":5686,"children":5687},{"style":80},[5688],{"type":23,"value":5582},{"type":17,"tag":36,"props":5690,"children":5691},{"style":395},[5692],{"type":23,"value":482},{"type":17,"tag":36,"props":5694,"children":5695},{"style":422},[5696],{"type":23,"value":5697}," 'MyCom3'\"",{"type":17,"tag":36,"props":5699,"children":5700},{"style":80},[5701],{"type":23,"value":5702},">com3\u003C\u002F",{"type":17,"tag":36,"props":5704,"children":5705},{"style":86},[5706],{"type":23,"value":3739},{"type":17,"tag":36,"props":5708,"children":5709},{"style":80},[5710],{"type":23,"value":543},{"type":17,"tag":36,"props":5712,"children":5713},{"class":38,"line":202},[5714,5718,5723],{"type":17,"tag":36,"props":5715,"children":5716},{"style":80},[5717],{"type":23,"value":821},{"type":17,"tag":36,"props":5719,"children":5720},{"style":86},[5721],{"type":23,"value":5722},"keep-alive",{"type":17,"tag":36,"props":5724,"children":5725},{"style":80},[5726],{"type":23,"value":543},{"type":17,"tag":36,"props":5728,"children":5729},{"class":38,"line":224},[5730,5734,5739,5743,5748,5752,5756,5761,5765,5769,5773],{"type":17,"tag":36,"props":5731,"children":5732},{"style":80},[5733],{"type":23,"value":3073},{"type":17,"tag":36,"props":5735,"children":5736},{"style":86},[5737],{"type":23,"value":5738},"component",{"type":17,"tag":36,"props":5740,"children":5741},{"style":80},[5742],{"type":23,"value":680},{"type":17,"tag":36,"props":5744,"children":5745},{"style":411},[5746],{"type":23,"value":5747},"is",{"type":17,"tag":36,"props":5749,"children":5750},{"style":80},[5751],{"type":23,"value":482},{"type":17,"tag":36,"props":5753,"children":5754},{"style":422},[5755],{"type":23,"value":842},{"type":17,"tag":36,"props":5757,"children":5758},{"style":80},[5759],{"type":23,"value":5760},"nowCom",{"type":17,"tag":36,"props":5762,"children":5763},{"style":422},[5764],{"type":23,"value":842},{"type":17,"tag":36,"props":5766,"children":5767},{"style":80},[5768],{"type":23,"value":1680},{"type":17,"tag":36,"props":5770,"children":5771},{"style":86},[5772],{"type":23,"value":5738},{"type":17,"tag":36,"props":5774,"children":5775},{"style":80},[5776],{"type":23,"value":543},{"type":17,"tag":36,"props":5778,"children":5779},{"class":38,"line":246},[5780,5785,5789],{"type":17,"tag":36,"props":5781,"children":5782},{"style":80},[5783],{"type":23,"value":5784}," \u003C\u002F",{"type":17,"tag":36,"props":5786,"children":5787},{"style":86},[5788],{"type":23,"value":5722},{"type":17,"tag":36,"props":5790,"children":5791},{"style":80},[5792],{"type":23,"value":543},{"type":17,"tag":36,"props":5794,"children":5795},{"class":38,"line":267},[5796,5800,5804],{"type":17,"tag":36,"props":5797,"children":5798},{"style":80},[5799],{"type":23,"value":960},{"type":17,"tag":36,"props":5801,"children":5802},{"style":86},[5803],{"type":23,"value":794},{"type":17,"tag":36,"props":5805,"children":5806},{"style":80},[5807],{"type":23,"value":543},{"type":17,"tag":36,"props":5809,"children":5810},{"class":38,"line":276},[5811,5815,5819],{"type":17,"tag":36,"props":5812,"children":5813},{"style":80},[5814],{"type":23,"value":750},{"type":17,"tag":36,"props":5816,"children":5817},{"style":86},[5818],{"type":23,"value":777},{"type":17,"tag":36,"props":5820,"children":5821},{"style":80},[5822],{"type":23,"value":543},{"type":17,"tag":36,"props":5824,"children":5825},{"class":38,"line":285},[5826],{"type":17,"tag":36,"props":5827,"children":5828},{"emptyLinePlaceholder":617},[5829],{"type":23,"value":620},{"type":17,"tag":36,"props":5831,"children":5832},{"class":38,"line":815},[5833,5837,5841],{"type":17,"tag":36,"props":5834,"children":5835},{"style":80},[5836],{"type":23,"value":528},{"type":17,"tag":36,"props":5838,"children":5839},{"style":86},[5840],{"type":23,"value":533},{"type":17,"tag":36,"props":5842,"children":5843},{"style":80},[5844],{"type":23,"value":543},{"type":17,"tag":36,"props":5846,"children":5847},{"class":38,"line":954},[5848,5852,5857,5861],{"type":17,"tag":36,"props":5849,"children":5850},{"style":395},[5851],{"type":23,"value":1768},{"type":17,"tag":36,"props":5853,"children":5854},{"style":80},[5855],{"type":23,"value":5856}," MyCom1 ",{"type":17,"tag":36,"props":5858,"children":5859},{"style":395},[5860],{"type":23,"value":1047},{"type":17,"tag":36,"props":5862,"children":5863},{"style":422},[5864],{"type":23,"value":5865}," '..\u002Fcomponents\u002FMyCom1.vue'\n",{"type":17,"tag":36,"props":5867,"children":5868},{"class":38,"line":971},[5869,5873,5878,5882],{"type":17,"tag":36,"props":5870,"children":5871},{"style":395},[5872],{"type":23,"value":1768},{"type":17,"tag":36,"props":5874,"children":5875},{"style":80},[5876],{"type":23,"value":5877}," MyCom2 ",{"type":17,"tag":36,"props":5879,"children":5880},{"style":395},[5881],{"type":23,"value":1047},{"type":17,"tag":36,"props":5883,"children":5884},{"style":422},[5885],{"type":23,"value":5886}," '..\u002Fcomponents\u002FMyCom2.vue'\n",{"type":17,"tag":36,"props":5888,"children":5889},{"class":38,"line":2770},[5890,5894,5899,5903],{"type":17,"tag":36,"props":5891,"children":5892},{"style":395},[5893],{"type":23,"value":1768},{"type":17,"tag":36,"props":5895,"children":5896},{"style":80},[5897],{"type":23,"value":5898}," MyCom3 ",{"type":17,"tag":36,"props":5900,"children":5901},{"style":395},[5902],{"type":23,"value":1047},{"type":17,"tag":36,"props":5904,"children":5905},{"style":422},[5906],{"type":23,"value":5907}," '..\u002Fcomponents\u002FMyCom3.vue'\n",{"type":17,"tag":36,"props":5909,"children":5910},{"class":38,"line":2778},[5911],{"type":17,"tag":36,"props":5912,"children":5913},{"emptyLinePlaceholder":617},[5914],{"type":23,"value":620},{"type":17,"tag":36,"props":5916,"children":5917},{"class":38,"line":2794},[5918,5922,5926],{"type":17,"tag":36,"props":5919,"children":5920},{"style":395},[5921],{"type":23,"value":3282},{"type":17,"tag":36,"props":5923,"children":5924},{"style":395},[5925],{"type":23,"value":3287},{"type":17,"tag":36,"props":5927,"children":5928},{"style":80},[5929],{"type":23,"value":94},{"type":17,"tag":36,"props":5931,"children":5932},{"class":38,"line":2830},[5933,5937,5942],{"type":17,"tag":36,"props":5934,"children":5935},{"style":80},[5936],{"type":23,"value":3299},{"type":17,"tag":36,"props":5938,"children":5939},{"style":422},[5940],{"type":23,"value":5941},"\"04_动态组件\"",{"type":17,"tag":36,"props":5943,"children":5944},{"style":80},[5945],{"type":23,"value":3309},{"type":17,"tag":36,"props":5947,"children":5948},{"class":38,"line":2863},[5949,5953],{"type":17,"tag":36,"props":5950,"children":5951},{"style":411},[5952],{"type":23,"value":3317},{"type":17,"tag":36,"props":5954,"children":5955},{"style":80},[5956],{"type":23,"value":638},{"type":17,"tag":36,"props":5958,"children":5959},{"class":38,"line":3058},[5960,5964],{"type":17,"tag":36,"props":5961,"children":5962},{"style":395},[5963],{"type":23,"value":3329},{"type":17,"tag":36,"props":5965,"children":5966},{"style":80},[5967],{"type":23,"value":94},{"type":17,"tag":36,"props":5969,"children":5970},{"class":38,"line":3067},[5971,5976],{"type":17,"tag":36,"props":5972,"children":5973},{"style":80},[5974],{"type":23,"value":5975}," nowCom: ",{"type":17,"tag":36,"props":5977,"children":5978},{"style":422},[5979],{"type":23,"value":5980},"'MyCom1'\n",{"type":17,"tag":36,"props":5982,"children":5983},{"class":38,"line":3085},[5984],{"type":17,"tag":36,"props":5985,"children":5986},{"style":80},[5987],{"type":23,"value":273},{"type":17,"tag":36,"props":5989,"children":5990},{"class":38,"line":3094},[5991],{"type":17,"tag":36,"props":5992,"children":5993},{"style":80},[5994],{"type":23,"value":3361},{"type":17,"tag":36,"props":5996,"children":5997},{"class":38,"line":3103},[5998],{"type":17,"tag":36,"props":5999,"children":6000},{"style":80},[6001],{"type":23,"value":6002}," components: {\n",{"type":17,"tag":36,"props":6004,"children":6005},{"class":38,"line":3120},[6006],{"type":17,"tag":36,"props":6007,"children":6008},{"style":80},[6009],{"type":23,"value":6010}," MyCom1,\n",{"type":17,"tag":36,"props":6012,"children":6013},{"class":38,"line":3129},[6014],{"type":17,"tag":36,"props":6015,"children":6016},{"style":80},[6017],{"type":23,"value":6018}," MyCom2,\n",{"type":17,"tag":36,"props":6020,"children":6021},{"class":38,"line":3589},[6022],{"type":17,"tag":36,"props":6023,"children":6024},{"style":80},[6025],{"type":23,"value":6026}," MyCom3\n",{"type":17,"tag":36,"props":6028,"children":6029},{"class":38,"line":3597},[6030],{"type":17,"tag":36,"props":6031,"children":6032},{"style":80},[6033],{"type":23,"value":282},{"type":17,"tag":36,"props":6035,"children":6036},{"class":38,"line":3613},[6037],{"type":17,"tag":36,"props":6038,"children":6039},{"style":80},[6040],{"type":23,"value":291},{"type":17,"tag":36,"props":6042,"children":6043},{"class":38,"line":3621},[6044,6048,6052],{"type":17,"tag":36,"props":6045,"children":6046},{"style":80},[6047],{"type":23,"value":750},{"type":17,"tag":36,"props":6049,"children":6050},{"style":86},[6051],{"type":23,"value":533},{"type":17,"tag":36,"props":6053,"children":6054},{"style":80},[6055],{"type":23,"value":543},{"type":17,"tag":36,"props":6057,"children":6058},{"class":38,"line":3642},[6059],{"type":17,"tag":36,"props":6060,"children":6061},{"emptyLinePlaceholder":617},[6062],{"type":23,"value":620},{"type":17,"tag":36,"props":6064,"children":6065},{"class":38,"line":3650},[6066,6070,6074,6078],{"type":17,"tag":36,"props":6067,"children":6068},{"style":80},[6069],{"type":23,"value":528},{"type":17,"tag":36,"props":6071,"children":6072},{"style":86},[6073],{"type":23,"value":505},{"type":17,"tag":36,"props":6075,"children":6076},{"style":411},[6077],{"type":23,"value":3635},{"type":17,"tag":36,"props":6079,"children":6080},{"style":80},[6081],{"type":23,"value":543},{"type":17,"tag":36,"props":6083,"children":6084},{"class":38,"line":5022},[6085],{"type":17,"tag":36,"props":6086,"children":6087},{"emptyLinePlaceholder":617},[6088],{"type":23,"value":620},{"type":17,"tag":36,"props":6090,"children":6091},{"class":38,"line":5030},[6092,6096,6100],{"type":17,"tag":36,"props":6093,"children":6094},{"style":80},[6095],{"type":23,"value":750},{"type":17,"tag":36,"props":6097,"children":6098},{"style":86},[6099],{"type":23,"value":505},{"type":17,"tag":36,"props":6101,"children":6102},{"style":80},[6103],{"type":23,"value":543},{"type":17,"tag":304,"props":6105,"children":6107},{"id":6106},"异步组件与suspense一起使用",[6108],{"type":23,"value":6109},"异步组件与Suspense一起使用",{"type":17,"tag":368,"props":6111,"children":6112},{},[6113,6118],{"type":17,"tag":323,"props":6114,"children":6115},{},[6116],{"type":23,"value":6117},"异步组件(defineAsyncComponent)：在大型应用中，我们可能需要将应用分割成小一些的代码块，并且只在需要的时候才从服务器加载一个模块，按需加载",{"type":17,"tag":323,"props":6119,"children":6120},{},[6121],{"type":23,"value":6122},"Suspense：Vue的内置组件，在异步组件没有加载出来的时候   用来占位的",{"type":17,"tag":25,"props":6124,"children":6126},{"className":339,"code":6125,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Cdiv>\n \u003Ch2>异步组件\u003C\u002Fh2>\n \u003Cbutton @click=\"nowCom = 'MyCom1'\">com1\u003C\u002Fbutton>\n \u003Cbutton @click=\"nowCom = 'MyCom2'\">com2\u003C\u002Fbutton>\n \u003Cbutton @click=\"nowCom = 'MyCom3'\">com3\u003C\u002Fbutton>\n \u003Ckeep-alive>\n \u003C!-- 在异步组件没有加载出来的时候 来站位的 -->\n \u003Csuspense>\n \u003Ccomponent :is=\"nowCom\">\u003C\u002Fcomponent>\n \u003Ctemplate #fallback>loading\u003C\u002Ftemplate>\n \u003C\u002Fsuspense>\n \u003C\u002Fkeep-alive>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript>\n\u002F\u002F import MyCom1 from '..\u002Fcomponents\u002FMyCom1.vue'\n\u002F\u002F import MyCom2 from '..\u002Fcomponents\u002FMyCom2.vue'\n\u002F\u002F import MyCom3 from '..\u002Fcomponents\u002FMyCom3.vue'\nimport { defineAsyncComponent } from 'vue'\n\nexport default {\n name: \"04_动态组件\",\n data() {\n return {\n nowCom: 'MyCom1'\n }\n },\n components: {\n \u002F\u002F 异步加载组件 按需加载\n MyCom1: defineAsyncComponent(() => import(\"..\u002Fcomponents\u002FMyCom1.vue\")),\n MyCom2: defineAsyncComponent(() => import(\"..\u002Fcomponents\u002FMyCom2.vue\")),\n MyCom3: defineAsyncComponent(() => import(\"..\u002Fcomponents\u002FMyCom3.vue\"))\n }\n}\n\u003C\u002Fscript>\n",[6127],{"type":17,"tag":32,"props":6128,"children":6129},{"__ignoreMap":7},[6130,6145,6160,6184,6235,6286,6337,6352,6360,6376,6424,6458,6473,6488,6503,6518,6525,6540,6548,6556,6564,6584,6591,6606,6621,6632,6643,6654,6661,6668,6675,6683,6723,6760,6798,6805,6812],{"type":17,"tag":36,"props":6131,"children":6132},{"class":38,"line":39},[6133,6137,6141],{"type":17,"tag":36,"props":6134,"children":6135},{"style":80},[6136],{"type":23,"value":528},{"type":17,"tag":36,"props":6138,"children":6139},{"style":86},[6140],{"type":23,"value":777},{"type":17,"tag":36,"props":6142,"children":6143},{"style":80},[6144],{"type":23,"value":543},{"type":17,"tag":36,"props":6146,"children":6147},{"class":38,"line":48},[6148,6152,6156],{"type":17,"tag":36,"props":6149,"children":6150},{"style":80},[6151],{"type":23,"value":789},{"type":17,"tag":36,"props":6153,"children":6154},{"style":86},[6155],{"type":23,"value":794},{"type":17,"tag":36,"props":6157,"children":6158},{"style":80},[6159],{"type":23,"value":543},{"type":17,"tag":36,"props":6161,"children":6162},{"class":38,"line":115},[6163,6167,6171,6176,6180],{"type":17,"tag":36,"props":6164,"children":6165},{"style":80},[6166],{"type":23,"value":821},{"type":17,"tag":36,"props":6168,"children":6169},{"style":86},[6170],{"type":23,"value":61},{"type":17,"tag":36,"props":6172,"children":6173},{"style":80},[6174],{"type":23,"value":6175},">异步组件\u003C\u002F",{"type":17,"tag":36,"props":6177,"children":6178},{"style":86},[6179],{"type":23,"value":61},{"type":17,"tag":36,"props":6181,"children":6182},{"style":80},[6183],{"type":23,"value":543},{"type":17,"tag":36,"props":6185,"children":6186},{"class":38,"line":133},[6187,6191,6195,6199,6203,6207,6211,6215,6219,6223,6227,6231],{"type":17,"tag":36,"props":6188,"children":6189},{"style":80},[6190],{"type":23,"value":821},{"type":17,"tag":36,"props":6192,"children":6193},{"style":86},[6194],{"type":23,"value":3739},{"type":17,"tag":36,"props":6196,"children":6197},{"style":80},[6198],{"type":23,"value":916},{"type":17,"tag":36,"props":6200,"children":6201},{"style":411},[6202],{"type":23,"value":921},{"type":17,"tag":36,"props":6204,"children":6205},{"style":80},[6206],{"type":23,"value":482},{"type":17,"tag":36,"props":6208,"children":6209},{"style":422},[6210],{"type":23,"value":842},{"type":17,"tag":36,"props":6212,"children":6213},{"style":80},[6214],{"type":23,"value":5582},{"type":17,"tag":36,"props":6216,"children":6217},{"style":395},[6218],{"type":23,"value":482},{"type":17,"tag":36,"props":6220,"children":6221},{"style":422},[6222],{"type":23,"value":5591},{"type":17,"tag":36,"props":6224,"children":6225},{"style":80},[6226],{"type":23,"value":5596},{"type":17,"tag":36,"props":6228,"children":6229},{"style":86},[6230],{"type":23,"value":3739},{"type":17,"tag":36,"props":6232,"children":6233},{"style":80},[6234],{"type":23,"value":543},{"type":17,"tag":36,"props":6236,"children":6237},{"class":38,"line":157},[6238,6242,6246,6250,6254,6258,6262,6266,6270,6274,6278,6282],{"type":17,"tag":36,"props":6239,"children":6240},{"style":80},[6241],{"type":23,"value":821},{"type":17,"tag":36,"props":6243,"children":6244},{"style":86},[6245],{"type":23,"value":3739},{"type":17,"tag":36,"props":6247,"children":6248},{"style":80},[6249],{"type":23,"value":916},{"type":17,"tag":36,"props":6251,"children":6252},{"style":411},[6253],{"type":23,"value":921},{"type":17,"tag":36,"props":6255,"children":6256},{"style":80},[6257],{"type":23,"value":482},{"type":17,"tag":36,"props":6259,"children":6260},{"style":422},[6261],{"type":23,"value":842},{"type":17,"tag":36,"props":6263,"children":6264},{"style":80},[6265],{"type":23,"value":5582},{"type":17,"tag":36,"props":6267,"children":6268},{"style":395},[6269],{"type":23,"value":482},{"type":17,"tag":36,"props":6271,"children":6272},{"style":422},[6273],{"type":23,"value":5644},{"type":17,"tag":36,"props":6275,"children":6276},{"style":80},[6277],{"type":23,"value":5649},{"type":17,"tag":36,"props":6279,"children":6280},{"style":86},[6281],{"type":23,"value":3739},{"type":17,"tag":36,"props":6283,"children":6284},{"style":80},[6285],{"type":23,"value":543},{"type":17,"tag":36,"props":6287,"children":6288},{"class":38,"line":180},[6289,6293,6297,6301,6305,6309,6313,6317,6321,6325,6329,6333],{"type":17,"tag":36,"props":6290,"children":6291},{"style":80},[6292],{"type":23,"value":821},{"type":17,"tag":36,"props":6294,"children":6295},{"style":86},[6296],{"type":23,"value":3739},{"type":17,"tag":36,"props":6298,"children":6299},{"style":80},[6300],{"type":23,"value":916},{"type":17,"tag":36,"props":6302,"children":6303},{"style":411},[6304],{"type":23,"value":921},{"type":17,"tag":36,"props":6306,"children":6307},{"style":80},[6308],{"type":23,"value":482},{"type":17,"tag":36,"props":6310,"children":6311},{"style":422},[6312],{"type":23,"value":842},{"type":17,"tag":36,"props":6314,"children":6315},{"style":80},[6316],{"type":23,"value":5582},{"type":17,"tag":36,"props":6318,"children":6319},{"style":395},[6320],{"type":23,"value":482},{"type":17,"tag":36,"props":6322,"children":6323},{"style":422},[6324],{"type":23,"value":5697},{"type":17,"tag":36,"props":6326,"children":6327},{"style":80},[6328],{"type":23,"value":5702},{"type":17,"tag":36,"props":6330,"children":6331},{"style":86},[6332],{"type":23,"value":3739},{"type":17,"tag":36,"props":6334,"children":6335},{"style":80},[6336],{"type":23,"value":543},{"type":17,"tag":36,"props":6338,"children":6339},{"class":38,"line":202},[6340,6344,6348],{"type":17,"tag":36,"props":6341,"children":6342},{"style":80},[6343],{"type":23,"value":821},{"type":17,"tag":36,"props":6345,"children":6346},{"style":86},[6347],{"type":23,"value":5722},{"type":17,"tag":36,"props":6349,"children":6350},{"style":80},[6351],{"type":23,"value":543},{"type":17,"tag":36,"props":6353,"children":6354},{"class":38,"line":224},[6355],{"type":17,"tag":36,"props":6356,"children":6357},{"style":1805},[6358],{"type":23,"value":6359}," \u003C!-- 在异步组件没有加载出来的时候 来站位的 -->\n",{"type":17,"tag":36,"props":6361,"children":6362},{"class":38,"line":246},[6363,6367,6372],{"type":17,"tag":36,"props":6364,"children":6365},{"style":80},[6366],{"type":23,"value":3073},{"type":17,"tag":36,"props":6368,"children":6369},{"style":86},[6370],{"type":23,"value":6371},"suspense",{"type":17,"tag":36,"props":6373,"children":6374},{"style":80},[6375],{"type":23,"value":543},{"type":17,"tag":36,"props":6377,"children":6378},{"class":38,"line":267},[6379,6384,6388,6392,6396,6400,6404,6408,6412,6416,6420],{"type":17,"tag":36,"props":6380,"children":6381},{"style":80},[6382],{"type":23,"value":6383}," \u003C",{"type":17,"tag":36,"props":6385,"children":6386},{"style":86},[6387],{"type":23,"value":5738},{"type":17,"tag":36,"props":6389,"children":6390},{"style":80},[6391],{"type":23,"value":680},{"type":17,"tag":36,"props":6393,"children":6394},{"style":411},[6395],{"type":23,"value":5747},{"type":17,"tag":36,"props":6397,"children":6398},{"style":80},[6399],{"type":23,"value":482},{"type":17,"tag":36,"props":6401,"children":6402},{"style":422},[6403],{"type":23,"value":842},{"type":17,"tag":36,"props":6405,"children":6406},{"style":80},[6407],{"type":23,"value":5760},{"type":17,"tag":36,"props":6409,"children":6410},{"style":422},[6411],{"type":23,"value":842},{"type":17,"tag":36,"props":6413,"children":6414},{"style":80},[6415],{"type":23,"value":1680},{"type":17,"tag":36,"props":6417,"children":6418},{"style":86},[6419],{"type":23,"value":5738},{"type":17,"tag":36,"props":6421,"children":6422},{"style":80},[6423],{"type":23,"value":543},{"type":17,"tag":36,"props":6425,"children":6426},{"class":38,"line":276},[6427,6431,6435,6440,6445,6450,6454],{"type":17,"tag":36,"props":6428,"children":6429},{"style":80},[6430],{"type":23,"value":6383},{"type":17,"tag":36,"props":6432,"children":6433},{"style":86},[6434],{"type":23,"value":777},{"type":17,"tag":36,"props":6436,"children":6437},{"style":80},[6438],{"type":23,"value":6439}," #",{"type":17,"tag":36,"props":6441,"children":6442},{"style":411},[6443],{"type":23,"value":6444},"fallback",{"type":17,"tag":36,"props":6446,"children":6447},{"style":80},[6448],{"type":23,"value":6449},">loading\u003C\u002F",{"type":17,"tag":36,"props":6451,"children":6452},{"style":86},[6453],{"type":23,"value":777},{"type":17,"tag":36,"props":6455,"children":6456},{"style":80},[6457],{"type":23,"value":543},{"type":17,"tag":36,"props":6459,"children":6460},{"class":38,"line":285},[6461,6465,6469],{"type":17,"tag":36,"props":6462,"children":6463},{"style":80},[6464],{"type":23,"value":3109},{"type":17,"tag":36,"props":6466,"children":6467},{"style":86},[6468],{"type":23,"value":6371},{"type":17,"tag":36,"props":6470,"children":6471},{"style":80},[6472],{"type":23,"value":543},{"type":17,"tag":36,"props":6474,"children":6475},{"class":38,"line":815},[6476,6480,6484],{"type":17,"tag":36,"props":6477,"children":6478},{"style":80},[6479],{"type":23,"value":5784},{"type":17,"tag":36,"props":6481,"children":6482},{"style":86},[6483],{"type":23,"value":5722},{"type":17,"tag":36,"props":6485,"children":6486},{"style":80},[6487],{"type":23,"value":543},{"type":17,"tag":36,"props":6489,"children":6490},{"class":38,"line":954},[6491,6495,6499],{"type":17,"tag":36,"props":6492,"children":6493},{"style":80},[6494],{"type":23,"value":960},{"type":17,"tag":36,"props":6496,"children":6497},{"style":86},[6498],{"type":23,"value":794},{"type":17,"tag":36,"props":6500,"children":6501},{"style":80},[6502],{"type":23,"value":543},{"type":17,"tag":36,"props":6504,"children":6505},{"class":38,"line":971},[6506,6510,6514],{"type":17,"tag":36,"props":6507,"children":6508},{"style":80},[6509],{"type":23,"value":750},{"type":17,"tag":36,"props":6511,"children":6512},{"style":86},[6513],{"type":23,"value":777},{"type":17,"tag":36,"props":6515,"children":6516},{"style":80},[6517],{"type":23,"value":543},{"type":17,"tag":36,"props":6519,"children":6520},{"class":38,"line":2770},[6521],{"type":17,"tag":36,"props":6522,"children":6523},{"emptyLinePlaceholder":617},[6524],{"type":23,"value":620},{"type":17,"tag":36,"props":6526,"children":6527},{"class":38,"line":2778},[6528,6532,6536],{"type":17,"tag":36,"props":6529,"children":6530},{"style":80},[6531],{"type":23,"value":528},{"type":17,"tag":36,"props":6533,"children":6534},{"style":86},[6535],{"type":23,"value":533},{"type":17,"tag":36,"props":6537,"children":6538},{"style":80},[6539],{"type":23,"value":543},{"type":17,"tag":36,"props":6541,"children":6542},{"class":38,"line":2794},[6543],{"type":17,"tag":36,"props":6544,"children":6545},{"style":1805},[6546],{"type":23,"value":6547},"\u002F\u002F import MyCom1 from '..\u002Fcomponents\u002FMyCom1.vue'\n",{"type":17,"tag":36,"props":6549,"children":6550},{"class":38,"line":2830},[6551],{"type":17,"tag":36,"props":6552,"children":6553},{"style":1805},[6554],{"type":23,"value":6555},"\u002F\u002F import MyCom2 from '..\u002Fcomponents\u002FMyCom2.vue'\n",{"type":17,"tag":36,"props":6557,"children":6558},{"class":38,"line":2863},[6559],{"type":17,"tag":36,"props":6560,"children":6561},{"style":1805},[6562],{"type":23,"value":6563},"\u002F\u002F import MyCom3 from '..\u002Fcomponents\u002FMyCom3.vue'\n",{"type":17,"tag":36,"props":6565,"children":6566},{"class":38,"line":3058},[6567,6571,6576,6580],{"type":17,"tag":36,"props":6568,"children":6569},{"style":395},[6570],{"type":23,"value":1768},{"type":17,"tag":36,"props":6572,"children":6573},{"style":80},[6574],{"type":23,"value":6575}," { defineAsyncComponent } ",{"type":17,"tag":36,"props":6577,"children":6578},{"style":395},[6579],{"type":23,"value":1047},{"type":17,"tag":36,"props":6581,"children":6582},{"style":422},[6583],{"type":23,"value":1052},{"type":17,"tag":36,"props":6585,"children":6586},{"class":38,"line":3067},[6587],{"type":17,"tag":36,"props":6588,"children":6589},{"emptyLinePlaceholder":617},[6590],{"type":23,"value":620},{"type":17,"tag":36,"props":6592,"children":6593},{"class":38,"line":3085},[6594,6598,6602],{"type":17,"tag":36,"props":6595,"children":6596},{"style":395},[6597],{"type":23,"value":3282},{"type":17,"tag":36,"props":6599,"children":6600},{"style":395},[6601],{"type":23,"value":3287},{"type":17,"tag":36,"props":6603,"children":6604},{"style":80},[6605],{"type":23,"value":94},{"type":17,"tag":36,"props":6607,"children":6608},{"class":38,"line":3094},[6609,6613,6617],{"type":17,"tag":36,"props":6610,"children":6611},{"style":80},[6612],{"type":23,"value":3299},{"type":17,"tag":36,"props":6614,"children":6615},{"style":422},[6616],{"type":23,"value":5941},{"type":17,"tag":36,"props":6618,"children":6619},{"style":80},[6620],{"type":23,"value":3309},{"type":17,"tag":36,"props":6622,"children":6623},{"class":38,"line":3103},[6624,6628],{"type":17,"tag":36,"props":6625,"children":6626},{"style":411},[6627],{"type":23,"value":3317},{"type":17,"tag":36,"props":6629,"children":6630},{"style":80},[6631],{"type":23,"value":638},{"type":17,"tag":36,"props":6633,"children":6634},{"class":38,"line":3120},[6635,6639],{"type":17,"tag":36,"props":6636,"children":6637},{"style":395},[6638],{"type":23,"value":3329},{"type":17,"tag":36,"props":6640,"children":6641},{"style":80},[6642],{"type":23,"value":94},{"type":17,"tag":36,"props":6644,"children":6645},{"class":38,"line":3129},[6646,6650],{"type":17,"tag":36,"props":6647,"children":6648},{"style":80},[6649],{"type":23,"value":5975},{"type":17,"tag":36,"props":6651,"children":6652},{"style":422},[6653],{"type":23,"value":5980},{"type":17,"tag":36,"props":6655,"children":6656},{"class":38,"line":3589},[6657],{"type":17,"tag":36,"props":6658,"children":6659},{"style":80},[6660],{"type":23,"value":273},{"type":17,"tag":36,"props":6662,"children":6663},{"class":38,"line":3597},[6664],{"type":17,"tag":36,"props":6665,"children":6666},{"style":80},[6667],{"type":23,"value":3361},{"type":17,"tag":36,"props":6669,"children":6670},{"class":38,"line":3613},[6671],{"type":17,"tag":36,"props":6672,"children":6673},{"style":80},[6674],{"type":23,"value":6002},{"type":17,"tag":36,"props":6676,"children":6677},{"class":38,"line":3621},[6678],{"type":17,"tag":36,"props":6679,"children":6680},{"style":1805},[6681],{"type":23,"value":6682}," \u002F\u002F 异步加载组件 按需加载\n",{"type":17,"tag":36,"props":6684,"children":6685},{"class":38,"line":3642},[6686,6691,6696,6700,6704,6709,6713,6718],{"type":17,"tag":36,"props":6687,"children":6688},{"style":80},[6689],{"type":23,"value":6690}," MyCom1: ",{"type":17,"tag":36,"props":6692,"children":6693},{"style":411},[6694],{"type":23,"value":6695},"defineAsyncComponent",{"type":17,"tag":36,"props":6697,"children":6698},{"style":80},[6699],{"type":23,"value":1133},{"type":17,"tag":36,"props":6701,"children":6702},{"style":395},[6703],{"type":23,"value":1138},{"type":17,"tag":36,"props":6705,"children":6706},{"style":395},[6707],{"type":23,"value":6708}," import",{"type":17,"tag":36,"props":6710,"children":6711},{"style":80},[6712],{"type":23,"value":419},{"type":17,"tag":36,"props":6714,"children":6715},{"style":422},[6716],{"type":23,"value":6717},"\"..\u002Fcomponents\u002FMyCom1.vue\"",{"type":17,"tag":36,"props":6719,"children":6720},{"style":80},[6721],{"type":23,"value":6722},")),\n",{"type":17,"tag":36,"props":6724,"children":6725},{"class":38,"line":3650},[6726,6731,6735,6739,6743,6747,6751,6756],{"type":17,"tag":36,"props":6727,"children":6728},{"style":80},[6729],{"type":23,"value":6730}," MyCom2: ",{"type":17,"tag":36,"props":6732,"children":6733},{"style":411},[6734],{"type":23,"value":6695},{"type":17,"tag":36,"props":6736,"children":6737},{"style":80},[6738],{"type":23,"value":1133},{"type":17,"tag":36,"props":6740,"children":6741},{"style":395},[6742],{"type":23,"value":1138},{"type":17,"tag":36,"props":6744,"children":6745},{"style":395},[6746],{"type":23,"value":6708},{"type":17,"tag":36,"props":6748,"children":6749},{"style":80},[6750],{"type":23,"value":419},{"type":17,"tag":36,"props":6752,"children":6753},{"style":422},[6754],{"type":23,"value":6755},"\"..\u002Fcomponents\u002FMyCom2.vue\"",{"type":17,"tag":36,"props":6757,"children":6758},{"style":80},[6759],{"type":23,"value":6722},{"type":17,"tag":36,"props":6761,"children":6762},{"class":38,"line":5022},[6763,6768,6772,6776,6780,6784,6788,6793],{"type":17,"tag":36,"props":6764,"children":6765},{"style":80},[6766],{"type":23,"value":6767}," MyCom3: ",{"type":17,"tag":36,"props":6769,"children":6770},{"style":411},[6771],{"type":23,"value":6695},{"type":17,"tag":36,"props":6773,"children":6774},{"style":80},[6775],{"type":23,"value":1133},{"type":17,"tag":36,"props":6777,"children":6778},{"style":395},[6779],{"type":23,"value":1138},{"type":17,"tag":36,"props":6781,"children":6782},{"style":395},[6783],{"type":23,"value":6708},{"type":17,"tag":36,"props":6785,"children":6786},{"style":80},[6787],{"type":23,"value":419},{"type":17,"tag":36,"props":6789,"children":6790},{"style":422},[6791],{"type":23,"value":6792},"\"..\u002Fcomponents\u002FMyCom3.vue\"",{"type":17,"tag":36,"props":6794,"children":6795},{"style":80},[6796],{"type":23,"value":6797},"))\n",{"type":17,"tag":36,"props":6799,"children":6800},{"class":38,"line":5030},[6801],{"type":17,"tag":36,"props":6802,"children":6803},{"style":80},[6804],{"type":23,"value":282},{"type":17,"tag":36,"props":6806,"children":6807},{"class":38,"line":5043},[6808],{"type":17,"tag":36,"props":6809,"children":6810},{"style":80},[6811],{"type":23,"value":291},{"type":17,"tag":36,"props":6813,"children":6814},{"class":38,"line":5064},[6815,6819,6823],{"type":17,"tag":36,"props":6816,"children":6817},{"style":80},[6818],{"type":23,"value":750},{"type":17,"tag":36,"props":6820,"children":6821},{"style":86},[6822],{"type":23,"value":533},{"type":17,"tag":36,"props":6824,"children":6825},{"style":80},[6826],{"type":23,"value":543},{"type":17,"tag":304,"props":6828,"children":6830},{"id":6829},"子孙组件通信",[6831],{"type":23,"value":6829},{"type":17,"tag":368,"props":6833,"children":6834},{},[6835],{"type":17,"tag":323,"props":6836,"children":6837},{},[6838],{"type":23,"value":6839},"Provide 与 Inject",{"type":17,"tag":25,"props":6841,"children":6843},{"className":339,"code":6842,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Ch2>Provide\u003C\u002Fh2>\n \u003CMiddle>\u003C\u002FMiddle>\n\n\u003C\u002Ftemplate>\n\n\u003Cscript>\nimport Middle from \".\u002F07_Middle.vue\"\n\nexport default {\n name: \"06_Provide\",\n data() {\n return {\n count: 123\n }\n },\n provide() {\n return {\n message: \"Message\",\n count: this.count,\n getInfo(data) {\n console.log(data)\n }\n }\n },\n components: {\n Middle\n }\n}\n\u003C\u002Fscript>\n\n\u003Cstyle scoped>\n\n\u003C\u002Fstyle>\n",[6844],{"type":17,"tag":32,"props":6845,"children":6846},{"__ignoreMap":7},[6847,6862,6886,6910,6917,6932,6939,6954,6975,6982,6997,7013,7024,7035,7048,7055,7062,7074,7085,7101,7117,7138,7154,7161,7168,7175,7182,7190,7197,7204,7219,7226,7245,7252],{"type":17,"tag":36,"props":6848,"children":6849},{"class":38,"line":39},[6850,6854,6858],{"type":17,"tag":36,"props":6851,"children":6852},{"style":80},[6853],{"type":23,"value":528},{"type":17,"tag":36,"props":6855,"children":6856},{"style":86},[6857],{"type":23,"value":777},{"type":17,"tag":36,"props":6859,"children":6860},{"style":80},[6861],{"type":23,"value":543},{"type":17,"tag":36,"props":6863,"children":6864},{"class":38,"line":48},[6865,6869,6873,6878,6882],{"type":17,"tag":36,"props":6866,"children":6867},{"style":80},[6868],{"type":23,"value":789},{"type":17,"tag":36,"props":6870,"children":6871},{"style":86},[6872],{"type":23,"value":61},{"type":17,"tag":36,"props":6874,"children":6875},{"style":80},[6876],{"type":23,"value":6877},">Provide\u003C\u002F",{"type":17,"tag":36,"props":6879,"children":6880},{"style":86},[6881],{"type":23,"value":61},{"type":17,"tag":36,"props":6883,"children":6884},{"style":80},[6885],{"type":23,"value":543},{"type":17,"tag":36,"props":6887,"children":6888},{"class":38,"line":115},[6889,6893,6898,6902,6906],{"type":17,"tag":36,"props":6890,"children":6891},{"style":80},[6892],{"type":23,"value":789},{"type":17,"tag":36,"props":6894,"children":6895},{"style":86},[6896],{"type":23,"value":6897},"Middle",{"type":17,"tag":36,"props":6899,"children":6900},{"style":80},[6901],{"type":23,"value":1680},{"type":17,"tag":36,"props":6903,"children":6904},{"style":86},[6905],{"type":23,"value":6897},{"type":17,"tag":36,"props":6907,"children":6908},{"style":80},[6909],{"type":23,"value":543},{"type":17,"tag":36,"props":6911,"children":6912},{"class":38,"line":133},[6913],{"type":17,"tag":36,"props":6914,"children":6915},{"emptyLinePlaceholder":617},[6916],{"type":23,"value":620},{"type":17,"tag":36,"props":6918,"children":6919},{"class":38,"line":157},[6920,6924,6928],{"type":17,"tag":36,"props":6921,"children":6922},{"style":80},[6923],{"type":23,"value":750},{"type":17,"tag":36,"props":6925,"children":6926},{"style":86},[6927],{"type":23,"value":777},{"type":17,"tag":36,"props":6929,"children":6930},{"style":80},[6931],{"type":23,"value":543},{"type":17,"tag":36,"props":6933,"children":6934},{"class":38,"line":180},[6935],{"type":17,"tag":36,"props":6936,"children":6937},{"emptyLinePlaceholder":617},[6938],{"type":23,"value":620},{"type":17,"tag":36,"props":6940,"children":6941},{"class":38,"line":202},[6942,6946,6950],{"type":17,"tag":36,"props":6943,"children":6944},{"style":80},[6945],{"type":23,"value":528},{"type":17,"tag":36,"props":6947,"children":6948},{"style":86},[6949],{"type":23,"value":533},{"type":17,"tag":36,"props":6951,"children":6952},{"style":80},[6953],{"type":23,"value":543},{"type":17,"tag":36,"props":6955,"children":6956},{"class":38,"line":224},[6957,6961,6966,6970],{"type":17,"tag":36,"props":6958,"children":6959},{"style":395},[6960],{"type":23,"value":1768},{"type":17,"tag":36,"props":6962,"children":6963},{"style":80},[6964],{"type":23,"value":6965}," Middle ",{"type":17,"tag":36,"props":6967,"children":6968},{"style":395},[6969],{"type":23,"value":1047},{"type":17,"tag":36,"props":6971,"children":6972},{"style":422},[6973],{"type":23,"value":6974}," \".\u002F07_Middle.vue\"\n",{"type":17,"tag":36,"props":6976,"children":6977},{"class":38,"line":246},[6978],{"type":17,"tag":36,"props":6979,"children":6980},{"emptyLinePlaceholder":617},[6981],{"type":23,"value":620},{"type":17,"tag":36,"props":6983,"children":6984},{"class":38,"line":267},[6985,6989,6993],{"type":17,"tag":36,"props":6986,"children":6987},{"style":395},[6988],{"type":23,"value":3282},{"type":17,"tag":36,"props":6990,"children":6991},{"style":395},[6992],{"type":23,"value":3287},{"type":17,"tag":36,"props":6994,"children":6995},{"style":80},[6996],{"type":23,"value":94},{"type":17,"tag":36,"props":6998,"children":6999},{"class":38,"line":276},[7000,7004,7009],{"type":17,"tag":36,"props":7001,"children":7002},{"style":80},[7003],{"type":23,"value":3299},{"type":17,"tag":36,"props":7005,"children":7006},{"style":422},[7007],{"type":23,"value":7008},"\"06_Provide\"",{"type":17,"tag":36,"props":7010,"children":7011},{"style":80},[7012],{"type":23,"value":3309},{"type":17,"tag":36,"props":7014,"children":7015},{"class":38,"line":285},[7016,7020],{"type":17,"tag":36,"props":7017,"children":7018},{"style":411},[7019],{"type":23,"value":3317},{"type":17,"tag":36,"props":7021,"children":7022},{"style":80},[7023],{"type":23,"value":638},{"type":17,"tag":36,"props":7025,"children":7026},{"class":38,"line":815},[7027,7031],{"type":17,"tag":36,"props":7028,"children":7029},{"style":395},[7030],{"type":23,"value":3329},{"type":17,"tag":36,"props":7032,"children":7033},{"style":80},[7034],{"type":23,"value":94},{"type":17,"tag":36,"props":7036,"children":7037},{"class":38,"line":954},[7038,7043],{"type":17,"tag":36,"props":7039,"children":7040},{"style":80},[7041],{"type":23,"value":7042}," count: ",{"type":17,"tag":36,"props":7044,"children":7045},{"style":105},[7046],{"type":23,"value":7047},"123\n",{"type":17,"tag":36,"props":7049,"children":7050},{"class":38,"line":971},[7051],{"type":17,"tag":36,"props":7052,"children":7053},{"style":80},[7054],{"type":23,"value":273},{"type":17,"tag":36,"props":7056,"children":7057},{"class":38,"line":2770},[7058],{"type":17,"tag":36,"props":7059,"children":7060},{"style":80},[7061],{"type":23,"value":3361},{"type":17,"tag":36,"props":7063,"children":7064},{"class":38,"line":2778},[7065,7070],{"type":17,"tag":36,"props":7066,"children":7067},{"style":411},[7068],{"type":23,"value":7069}," provide",{"type":17,"tag":36,"props":7071,"children":7072},{"style":80},[7073],{"type":23,"value":638},{"type":17,"tag":36,"props":7075,"children":7076},{"class":38,"line":2794},[7077,7081],{"type":17,"tag":36,"props":7078,"children":7079},{"style":395},[7080],{"type":23,"value":3329},{"type":17,"tag":36,"props":7082,"children":7083},{"style":80},[7084],{"type":23,"value":94},{"type":17,"tag":36,"props":7086,"children":7087},{"class":38,"line":2830},[7088,7092,7097],{"type":17,"tag":36,"props":7089,"children":7090},{"style":80},[7091],{"type":23,"value":3341},{"type":17,"tag":36,"props":7093,"children":7094},{"style":422},[7095],{"type":23,"value":7096},"\"Message\"",{"type":17,"tag":36,"props":7098,"children":7099},{"style":80},[7100],{"type":23,"value":3309},{"type":17,"tag":36,"props":7102,"children":7103},{"class":38,"line":2863},[7104,7108,7112],{"type":17,"tag":36,"props":7105,"children":7106},{"style":80},[7107],{"type":23,"value":7042},{"type":17,"tag":36,"props":7109,"children":7110},{"style":105},[7111],{"type":23,"value":1731},{"type":17,"tag":36,"props":7113,"children":7114},{"style":80},[7115],{"type":23,"value":7116},".count,\n",{"type":17,"tag":36,"props":7118,"children":7119},{"class":38,"line":3058},[7120,7125,7129,7134],{"type":17,"tag":36,"props":7121,"children":7122},{"style":411},[7123],{"type":23,"value":7124}," getInfo",{"type":17,"tag":36,"props":7126,"children":7127},{"style":80},[7128],{"type":23,"value":419},{"type":17,"tag":36,"props":7130,"children":7131},{"style":1856},[7132],{"type":23,"value":7133},"data",{"type":17,"tag":36,"props":7135,"children":7136},{"style":80},[7137],{"type":23,"value":2285},{"type":17,"tag":36,"props":7139,"children":7140},{"class":38,"line":3067},[7141,7145,7149],{"type":17,"tag":36,"props":7142,"children":7143},{"style":80},[7144],{"type":23,"value":3482},{"type":17,"tag":36,"props":7146,"children":7147},{"style":411},[7148],{"type":23,"value":3428},{"type":17,"tag":36,"props":7150,"children":7151},{"style":80},[7152],{"type":23,"value":7153},"(data)\n",{"type":17,"tag":36,"props":7155,"children":7156},{"class":38,"line":3085},[7157],{"type":17,"tag":36,"props":7158,"children":7159},{"style":80},[7160],{"type":23,"value":4057},{"type":17,"tag":36,"props":7162,"children":7163},{"class":38,"line":3094},[7164],{"type":17,"tag":36,"props":7165,"children":7166},{"style":80},[7167],{"type":23,"value":273},{"type":17,"tag":36,"props":7169,"children":7170},{"class":38,"line":3103},[7171],{"type":17,"tag":36,"props":7172,"children":7173},{"style":80},[7174],{"type":23,"value":3361},{"type":17,"tag":36,"props":7176,"children":7177},{"class":38,"line":3120},[7178],{"type":17,"tag":36,"props":7179,"children":7180},{"style":80},[7181],{"type":23,"value":6002},{"type":17,"tag":36,"props":7183,"children":7184},{"class":38,"line":3129},[7185],{"type":17,"tag":36,"props":7186,"children":7187},{"style":80},[7188],{"type":23,"value":7189}," Middle\n",{"type":17,"tag":36,"props":7191,"children":7192},{"class":38,"line":3589},[7193],{"type":17,"tag":36,"props":7194,"children":7195},{"style":80},[7196],{"type":23,"value":282},{"type":17,"tag":36,"props":7198,"children":7199},{"class":38,"line":3597},[7200],{"type":17,"tag":36,"props":7201,"children":7202},{"style":80},[7203],{"type":23,"value":291},{"type":17,"tag":36,"props":7205,"children":7206},{"class":38,"line":3613},[7207,7211,7215],{"type":17,"tag":36,"props":7208,"children":7209},{"style":80},[7210],{"type":23,"value":750},{"type":17,"tag":36,"props":7212,"children":7213},{"style":86},[7214],{"type":23,"value":533},{"type":17,"tag":36,"props":7216,"children":7217},{"style":80},[7218],{"type":23,"value":543},{"type":17,"tag":36,"props":7220,"children":7221},{"class":38,"line":3621},[7222],{"type":17,"tag":36,"props":7223,"children":7224},{"emptyLinePlaceholder":617},[7225],{"type":23,"value":620},{"type":17,"tag":36,"props":7227,"children":7228},{"class":38,"line":3642},[7229,7233,7237,7241],{"type":17,"tag":36,"props":7230,"children":7231},{"style":80},[7232],{"type":23,"value":528},{"type":17,"tag":36,"props":7234,"children":7235},{"style":86},[7236],{"type":23,"value":505},{"type":17,"tag":36,"props":7238,"children":7239},{"style":411},[7240],{"type":23,"value":3635},{"type":17,"tag":36,"props":7242,"children":7243},{"style":80},[7244],{"type":23,"value":543},{"type":17,"tag":36,"props":7246,"children":7247},{"class":38,"line":3650},[7248],{"type":17,"tag":36,"props":7249,"children":7250},{"emptyLinePlaceholder":617},[7251],{"type":23,"value":620},{"type":17,"tag":36,"props":7253,"children":7254},{"class":38,"line":5022},[7255,7259,7263],{"type":17,"tag":36,"props":7256,"children":7257},{"style":80},[7258],{"type":23,"value":750},{"type":17,"tag":36,"props":7260,"children":7261},{"style":86},[7262],{"type":23,"value":505},{"type":17,"tag":36,"props":7264,"children":7265},{"style":80},[7266],{"type":23,"value":543},{"type":17,"tag":25,"props":7268,"children":7270},{"className":339,"code":7269,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Ch2>Inject {{ message }}{{ count }}\u003C\u002Fh2>\n\u003C\u002Ftemplate>\n\n\u003Cscript>\nexport default {\n name: \"08_Inject\",\n inject: [\"message\", \"count\", \"getInfo\"],\n mounted() {\n this.getInfo(\"Hello Inject\")\n }\n}\n\u003C\u002Fscript>\n\n\u003Cstyle scoped>\n\n\u003C\u002Fstyle>\n",[7271],{"type":17,"tag":32,"props":7272,"children":7273},{"__ignoreMap":7},[7274,7289,7313,7328,7335,7350,7365,7381,7416,7427,7457,7464,7471,7486,7493,7512,7519],{"type":17,"tag":36,"props":7275,"children":7276},{"class":38,"line":39},[7277,7281,7285],{"type":17,"tag":36,"props":7278,"children":7279},{"style":80},[7280],{"type":23,"value":528},{"type":17,"tag":36,"props":7282,"children":7283},{"style":86},[7284],{"type":23,"value":777},{"type":17,"tag":36,"props":7286,"children":7287},{"style":80},[7288],{"type":23,"value":543},{"type":17,"tag":36,"props":7290,"children":7291},{"class":38,"line":48},[7292,7296,7300,7305,7309],{"type":17,"tag":36,"props":7293,"children":7294},{"style":80},[7295],{"type":23,"value":789},{"type":17,"tag":36,"props":7297,"children":7298},{"style":86},[7299],{"type":23,"value":61},{"type":17,"tag":36,"props":7301,"children":7302},{"style":80},[7303],{"type":23,"value":7304},">Inject {{ message }}{{ count }}\u003C\u002F",{"type":17,"tag":36,"props":7306,"children":7307},{"style":86},[7308],{"type":23,"value":61},{"type":17,"tag":36,"props":7310,"children":7311},{"style":80},[7312],{"type":23,"value":543},{"type":17,"tag":36,"props":7314,"children":7315},{"class":38,"line":115},[7316,7320,7324],{"type":17,"tag":36,"props":7317,"children":7318},{"style":80},[7319],{"type":23,"value":750},{"type":17,"tag":36,"props":7321,"children":7322},{"style":86},[7323],{"type":23,"value":777},{"type":17,"tag":36,"props":7325,"children":7326},{"style":80},[7327],{"type":23,"value":543},{"type":17,"tag":36,"props":7329,"children":7330},{"class":38,"line":133},[7331],{"type":17,"tag":36,"props":7332,"children":7333},{"emptyLinePlaceholder":617},[7334],{"type":23,"value":620},{"type":17,"tag":36,"props":7336,"children":7337},{"class":38,"line":157},[7338,7342,7346],{"type":17,"tag":36,"props":7339,"children":7340},{"style":80},[7341],{"type":23,"value":528},{"type":17,"tag":36,"props":7343,"children":7344},{"style":86},[7345],{"type":23,"value":533},{"type":17,"tag":36,"props":7347,"children":7348},{"style":80},[7349],{"type":23,"value":543},{"type":17,"tag":36,"props":7351,"children":7352},{"class":38,"line":180},[7353,7357,7361],{"type":17,"tag":36,"props":7354,"children":7355},{"style":395},[7356],{"type":23,"value":3282},{"type":17,"tag":36,"props":7358,"children":7359},{"style":395},[7360],{"type":23,"value":3287},{"type":17,"tag":36,"props":7362,"children":7363},{"style":80},[7364],{"type":23,"value":94},{"type":17,"tag":36,"props":7366,"children":7367},{"class":38,"line":202},[7368,7372,7377],{"type":17,"tag":36,"props":7369,"children":7370},{"style":80},[7371],{"type":23,"value":3299},{"type":17,"tag":36,"props":7373,"children":7374},{"style":422},[7375],{"type":23,"value":7376},"\"08_Inject\"",{"type":17,"tag":36,"props":7378,"children":7379},{"style":80},[7380],{"type":23,"value":3309},{"type":17,"tag":36,"props":7382,"children":7383},{"class":38,"line":224},[7384,7389,7393,7397,7402,7406,7411],{"type":17,"tag":36,"props":7385,"children":7386},{"style":80},[7387],{"type":23,"value":7388}," inject: [",{"type":17,"tag":36,"props":7390,"children":7391},{"style":422},[7392],{"type":23,"value":2490},{"type":17,"tag":36,"props":7394,"children":7395},{"style":80},[7396],{"type":23,"value":3903},{"type":17,"tag":36,"props":7398,"children":7399},{"style":422},[7400],{"type":23,"value":7401},"\"count\"",{"type":17,"tag":36,"props":7403,"children":7404},{"style":80},[7405],{"type":23,"value":3903},{"type":17,"tag":36,"props":7407,"children":7408},{"style":422},[7409],{"type":23,"value":7410},"\"getInfo\"",{"type":17,"tag":36,"props":7412,"children":7413},{"style":80},[7414],{"type":23,"value":7415},"],\n",{"type":17,"tag":36,"props":7417,"children":7418},{"class":38,"line":246},[7419,7423],{"type":17,"tag":36,"props":7420,"children":7421},{"style":411},[7422],{"type":23,"value":3369},{"type":17,"tag":36,"props":7424,"children":7425},{"style":80},[7426],{"type":23,"value":638},{"type":17,"tag":36,"props":7428,"children":7429},{"class":38,"line":267},[7430,7435,7439,7444,7448,7453],{"type":17,"tag":36,"props":7431,"children":7432},{"style":105},[7433],{"type":23,"value":7434}," this",{"type":17,"tag":36,"props":7436,"children":7437},{"style":80},[7438],{"type":23,"value":1420},{"type":17,"tag":36,"props":7440,"children":7441},{"style":411},[7442],{"type":23,"value":7443},"getInfo",{"type":17,"tag":36,"props":7445,"children":7446},{"style":80},[7447],{"type":23,"value":419},{"type":17,"tag":36,"props":7449,"children":7450},{"style":422},[7451],{"type":23,"value":7452},"\"Hello Inject\"",{"type":17,"tag":36,"props":7454,"children":7455},{"style":80},[7456],{"type":23,"value":430},{"type":17,"tag":36,"props":7458,"children":7459},{"class":38,"line":276},[7460],{"type":17,"tag":36,"props":7461,"children":7462},{"style":80},[7463],{"type":23,"value":282},{"type":17,"tag":36,"props":7465,"children":7466},{"class":38,"line":285},[7467],{"type":17,"tag":36,"props":7468,"children":7469},{"style":80},[7470],{"type":23,"value":291},{"type":17,"tag":36,"props":7472,"children":7473},{"class":38,"line":815},[7474,7478,7482],{"type":17,"tag":36,"props":7475,"children":7476},{"style":80},[7477],{"type":23,"value":750},{"type":17,"tag":36,"props":7479,"children":7480},{"style":86},[7481],{"type":23,"value":533},{"type":17,"tag":36,"props":7483,"children":7484},{"style":80},[7485],{"type":23,"value":543},{"type":17,"tag":36,"props":7487,"children":7488},{"class":38,"line":954},[7489],{"type":17,"tag":36,"props":7490,"children":7491},{"emptyLinePlaceholder":617},[7492],{"type":23,"value":620},{"type":17,"tag":36,"props":7494,"children":7495},{"class":38,"line":971},[7496,7500,7504,7508],{"type":17,"tag":36,"props":7497,"children":7498},{"style":80},[7499],{"type":23,"value":528},{"type":17,"tag":36,"props":7501,"children":7502},{"style":86},[7503],{"type":23,"value":505},{"type":17,"tag":36,"props":7505,"children":7506},{"style":411},[7507],{"type":23,"value":3635},{"type":17,"tag":36,"props":7509,"children":7510},{"style":80},[7511],{"type":23,"value":543},{"type":17,"tag":36,"props":7513,"children":7514},{"class":38,"line":2770},[7515],{"type":17,"tag":36,"props":7516,"children":7517},{"emptyLinePlaceholder":617},[7518],{"type":23,"value":620},{"type":17,"tag":36,"props":7520,"children":7521},{"class":38,"line":2778},[7522,7526,7530],{"type":17,"tag":36,"props":7523,"children":7524},{"style":80},[7525],{"type":23,"value":750},{"type":17,"tag":36,"props":7527,"children":7528},{"style":86},[7529],{"type":23,"value":505},{"type":17,"tag":36,"props":7531,"children":7532},{"style":80},[7533],{"type":23,"value":543},{"type":17,"tag":304,"props":7535,"children":7537},{"id":7536},"render函数",[7538],{"type":23,"value":7536},{"type":17,"tag":25,"props":7540,"children":7542},{"className":339,"code":7541,"language":341,"meta":7,"style":7},"\u003Cscript>\nimport { h } from \"vue\"\nexport default {\n render() {\n return h(\"h2\", \"hello render函数\")\n }\n\n}\n\u003C\u002Fscript>\n\n\u003Cstyle lang=\"scss\" scoped>\n\n\u003C\u002Fstyle>\n",[7543],{"type":17,"tag":32,"props":7544,"children":7545},{"__ignoreMap":7},[7546,7561,7582,7597,7609,7644,7651,7658,7665,7680,7687,7719,7726],{"type":17,"tag":36,"props":7547,"children":7548},{"class":38,"line":39},[7549,7553,7557],{"type":17,"tag":36,"props":7550,"children":7551},{"style":80},[7552],{"type":23,"value":528},{"type":17,"tag":36,"props":7554,"children":7555},{"style":86},[7556],{"type":23,"value":533},{"type":17,"tag":36,"props":7558,"children":7559},{"style":80},[7560],{"type":23,"value":543},{"type":17,"tag":36,"props":7562,"children":7563},{"class":38,"line":48},[7564,7568,7573,7577],{"type":17,"tag":36,"props":7565,"children":7566},{"style":395},[7567],{"type":23,"value":1768},{"type":17,"tag":36,"props":7569,"children":7570},{"style":80},[7571],{"type":23,"value":7572}," { h } ",{"type":17,"tag":36,"props":7574,"children":7575},{"style":395},[7576],{"type":23,"value":1047},{"type":17,"tag":36,"props":7578,"children":7579},{"style":422},[7580],{"type":23,"value":7581}," \"vue\"\n",{"type":17,"tag":36,"props":7583,"children":7584},{"class":38,"line":115},[7585,7589,7593],{"type":17,"tag":36,"props":7586,"children":7587},{"style":395},[7588],{"type":23,"value":3282},{"type":17,"tag":36,"props":7590,"children":7591},{"style":395},[7592],{"type":23,"value":3287},{"type":17,"tag":36,"props":7594,"children":7595},{"style":80},[7596],{"type":23,"value":94},{"type":17,"tag":36,"props":7598,"children":7599},{"class":38,"line":133},[7600,7605],{"type":17,"tag":36,"props":7601,"children":7602},{"style":411},[7603],{"type":23,"value":7604}," render",{"type":17,"tag":36,"props":7606,"children":7607},{"style":80},[7608],{"type":23,"value":638},{"type":17,"tag":36,"props":7610,"children":7611},{"class":38,"line":157},[7612,7617,7622,7626,7631,7635,7640],{"type":17,"tag":36,"props":7613,"children":7614},{"style":395},[7615],{"type":23,"value":7616}," return",{"type":17,"tag":36,"props":7618,"children":7619},{"style":411},[7620],{"type":23,"value":7621}," h",{"type":17,"tag":36,"props":7623,"children":7624},{"style":80},[7625],{"type":23,"value":419},{"type":17,"tag":36,"props":7627,"children":7628},{"style":422},[7629],{"type":23,"value":7630},"\"h2\"",{"type":17,"tag":36,"props":7632,"children":7633},{"style":80},[7634],{"type":23,"value":3903},{"type":17,"tag":36,"props":7636,"children":7637},{"style":422},[7638],{"type":23,"value":7639},"\"hello render函数\"",{"type":17,"tag":36,"props":7641,"children":7642},{"style":80},[7643],{"type":23,"value":430},{"type":17,"tag":36,"props":7645,"children":7646},{"class":38,"line":180},[7647],{"type":17,"tag":36,"props":7648,"children":7649},{"style":80},[7650],{"type":23,"value":273},{"type":17,"tag":36,"props":7652,"children":7653},{"class":38,"line":202},[7654],{"type":17,"tag":36,"props":7655,"children":7656},{"emptyLinePlaceholder":617},[7657],{"type":23,"value":620},{"type":17,"tag":36,"props":7659,"children":7660},{"class":38,"line":224},[7661],{"type":17,"tag":36,"props":7662,"children":7663},{"style":80},[7664],{"type":23,"value":291},{"type":17,"tag":36,"props":7666,"children":7667},{"class":38,"line":246},[7668,7672,7676],{"type":17,"tag":36,"props":7669,"children":7670},{"style":80},[7671],{"type":23,"value":750},{"type":17,"tag":36,"props":7673,"children":7674},{"style":86},[7675],{"type":23,"value":533},{"type":17,"tag":36,"props":7677,"children":7678},{"style":80},[7679],{"type":23,"value":543},{"type":17,"tag":36,"props":7681,"children":7682},{"class":38,"line":267},[7683],{"type":17,"tag":36,"props":7684,"children":7685},{"emptyLinePlaceholder":617},[7686],{"type":23,"value":620},{"type":17,"tag":36,"props":7688,"children":7689},{"class":38,"line":276},[7690,7694,7698,7702,7706,7711,7715],{"type":17,"tag":36,"props":7691,"children":7692},{"style":80},[7693],{"type":23,"value":528},{"type":17,"tag":36,"props":7695,"children":7696},{"style":86},[7697],{"type":23,"value":505},{"type":17,"tag":36,"props":7699,"children":7700},{"style":411},[7701],{"type":23,"value":1016},{"type":17,"tag":36,"props":7703,"children":7704},{"style":80},[7705],{"type":23,"value":482},{"type":17,"tag":36,"props":7707,"children":7708},{"style":422},[7709],{"type":23,"value":7710},"\"scss\"",{"type":17,"tag":36,"props":7712,"children":7713},{"style":411},[7714],{"type":23,"value":3635},{"type":17,"tag":36,"props":7716,"children":7717},{"style":80},[7718],{"type":23,"value":543},{"type":17,"tag":36,"props":7720,"children":7721},{"class":38,"line":285},[7722],{"type":17,"tag":36,"props":7723,"children":7724},{"emptyLinePlaceholder":617},[7725],{"type":23,"value":620},{"type":17,"tag":36,"props":7727,"children":7728},{"class":38,"line":815},[7729,7733,7737],{"type":17,"tag":36,"props":7730,"children":7731},{"style":80},[7732],{"type":23,"value":750},{"type":17,"tag":36,"props":7734,"children":7735},{"style":86},[7736],{"type":23,"value":505},{"type":17,"tag":36,"props":7738,"children":7739},{"style":80},[7740],{"type":23,"value":543},{"type":17,"tag":61,"props":7742,"children":7744},{"id":7743},"compositionapi",[7745],{"type":23,"value":7746},"CompositionAPI",{"type":17,"tag":304,"props":7748,"children":7750},{"id":7749},"torefs",[7751],{"type":23,"value":7752},"toRefs",{"type":17,"tag":368,"props":7754,"children":7755},{},[7756],{"type":17,"tag":323,"props":7757,"children":7758},{},[7759],{"type":23,"value":7760},"toRefs可以通过结构的方式将reactive响应式数据转换成ref响应式数据",{"type":17,"tag":25,"props":7762,"children":7764},{"className":339,"code":7763,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Ch2>ref and reactive\u003C\u002Fh2>\n \u003Cbutton @click=\"count += 1\">点击+1\u003C\u002Fbutton>\n {{ state.count }} {{ count }}\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport { reactive, toRefs } from \"vue\"\n\nlet state = reactive({ count: 1 })\nlet { count } = toRefs(state)\n\u003C\u002Fscript>\n",[7765],{"type":17,"tag":32,"props":7766,"children":7767},{"__ignoreMap":7},[7768,7783,7807,7866,7874,7889,7896,7915,7935,7942,7973,7998],{"type":17,"tag":36,"props":7769,"children":7770},{"class":38,"line":39},[7771,7775,7779],{"type":17,"tag":36,"props":7772,"children":7773},{"style":80},[7774],{"type":23,"value":528},{"type":17,"tag":36,"props":7776,"children":7777},{"style":86},[7778],{"type":23,"value":777},{"type":17,"tag":36,"props":7780,"children":7781},{"style":80},[7782],{"type":23,"value":543},{"type":17,"tag":36,"props":7784,"children":7785},{"class":38,"line":48},[7786,7790,7794,7799,7803],{"type":17,"tag":36,"props":7787,"children":7788},{"style":80},[7789],{"type":23,"value":821},{"type":17,"tag":36,"props":7791,"children":7792},{"style":86},[7793],{"type":23,"value":61},{"type":17,"tag":36,"props":7795,"children":7796},{"style":80},[7797],{"type":23,"value":7798},">ref and reactive\u003C\u002F",{"type":17,"tag":36,"props":7800,"children":7801},{"style":86},[7802],{"type":23,"value":61},{"type":17,"tag":36,"props":7804,"children":7805},{"style":80},[7806],{"type":23,"value":543},{"type":17,"tag":36,"props":7808,"children":7809},{"class":38,"line":115},[7810,7814,7818,7822,7826,7830,7834,7839,7844,7849,7853,7858,7862],{"type":17,"tag":36,"props":7811,"children":7812},{"style":80},[7813],{"type":23,"value":821},{"type":17,"tag":36,"props":7815,"children":7816},{"style":86},[7817],{"type":23,"value":3739},{"type":17,"tag":36,"props":7819,"children":7820},{"style":80},[7821],{"type":23,"value":916},{"type":17,"tag":36,"props":7823,"children":7824},{"style":411},[7825],{"type":23,"value":921},{"type":17,"tag":36,"props":7827,"children":7828},{"style":80},[7829],{"type":23,"value":482},{"type":17,"tag":36,"props":7831,"children":7832},{"style":422},[7833],{"type":23,"value":842},{"type":17,"tag":36,"props":7835,"children":7836},{"style":80},[7837],{"type":23,"value":7838},"count ",{"type":17,"tag":36,"props":7840,"children":7841},{"style":395},[7842],{"type":23,"value":7843},"+=",{"type":17,"tag":36,"props":7845,"children":7846},{"style":105},[7847],{"type":23,"value":7848}," 1",{"type":17,"tag":36,"props":7850,"children":7851},{"style":422},[7852],{"type":23,"value":842},{"type":17,"tag":36,"props":7854,"children":7855},{"style":80},[7856],{"type":23,"value":7857},">点击+1\u003C\u002F",{"type":17,"tag":36,"props":7859,"children":7860},{"style":86},[7861],{"type":23,"value":3739},{"type":17,"tag":36,"props":7863,"children":7864},{"style":80},[7865],{"type":23,"value":543},{"type":17,"tag":36,"props":7867,"children":7868},{"class":38,"line":133},[7869],{"type":17,"tag":36,"props":7870,"children":7871},{"style":80},[7872],{"type":23,"value":7873}," {{ state.count }} {{ count }}\n",{"type":17,"tag":36,"props":7875,"children":7876},{"class":38,"line":157},[7877,7881,7885],{"type":17,"tag":36,"props":7878,"children":7879},{"style":80},[7880],{"type":23,"value":750},{"type":17,"tag":36,"props":7882,"children":7883},{"style":86},[7884],{"type":23,"value":777},{"type":17,"tag":36,"props":7886,"children":7887},{"style":80},[7888],{"type":23,"value":543},{"type":17,"tag":36,"props":7890,"children":7891},{"class":38,"line":180},[7892],{"type":17,"tag":36,"props":7893,"children":7894},{"emptyLinePlaceholder":617},[7895],{"type":23,"value":620},{"type":17,"tag":36,"props":7897,"children":7898},{"class":38,"line":202},[7899,7903,7907,7911],{"type":17,"tag":36,"props":7900,"children":7901},{"style":80},[7902],{"type":23,"value":528},{"type":17,"tag":36,"props":7904,"children":7905},{"style":86},[7906],{"type":23,"value":533},{"type":17,"tag":36,"props":7908,"children":7909},{"style":411},[7910],{"type":23,"value":538},{"type":17,"tag":36,"props":7912,"children":7913},{"style":80},[7914],{"type":23,"value":543},{"type":17,"tag":36,"props":7916,"children":7917},{"class":38,"line":224},[7918,7922,7927,7931],{"type":17,"tag":36,"props":7919,"children":7920},{"style":395},[7921],{"type":23,"value":1768},{"type":17,"tag":36,"props":7923,"children":7924},{"style":80},[7925],{"type":23,"value":7926}," { reactive, toRefs } ",{"type":17,"tag":36,"props":7928,"children":7929},{"style":395},[7930],{"type":23,"value":1047},{"type":17,"tag":36,"props":7932,"children":7933},{"style":422},[7934],{"type":23,"value":7581},{"type":17,"tag":36,"props":7936,"children":7937},{"class":38,"line":246},[7938],{"type":17,"tag":36,"props":7939,"children":7940},{"emptyLinePlaceholder":617},[7941],{"type":23,"value":620},{"type":17,"tag":36,"props":7943,"children":7944},{"class":38,"line":267},[7945,7949,7953,7957,7961,7965,7969],{"type":17,"tag":36,"props":7946,"children":7947},{"style":395},[7948],{"type":23,"value":472},{"type":17,"tag":36,"props":7950,"children":7951},{"style":80},[7952],{"type":23,"value":2034},{"type":17,"tag":36,"props":7954,"children":7955},{"style":395},[7956],{"type":23,"value":482},{"type":17,"tag":36,"props":7958,"children":7959},{"style":411},[7960],{"type":23,"value":2043},{"type":17,"tag":36,"props":7962,"children":7963},{"style":80},[7964],{"type":23,"value":2048},{"type":17,"tag":36,"props":7966,"children":7967},{"style":105},[7968],{"type":23,"value":1297},{"type":17,"tag":36,"props":7970,"children":7971},{"style":80},[7972],{"type":23,"value":1486},{"type":17,"tag":36,"props":7974,"children":7975},{"class":38,"line":276},[7976,7980,7984,7988,7993],{"type":17,"tag":36,"props":7977,"children":7978},{"style":395},[7979],{"type":23,"value":472},{"type":17,"tag":36,"props":7981,"children":7982},{"style":80},[7983],{"type":23,"value":2181},{"type":17,"tag":36,"props":7985,"children":7986},{"style":395},[7987],{"type":23,"value":482},{"type":17,"tag":36,"props":7989,"children":7990},{"style":411},[7991],{"type":23,"value":7992}," toRefs",{"type":17,"tag":36,"props":7994,"children":7995},{"style":80},[7996],{"type":23,"value":7997},"(state)\n",{"type":17,"tag":36,"props":7999,"children":8000},{"class":38,"line":285},[8001,8005,8009],{"type":17,"tag":36,"props":8002,"children":8003},{"style":80},[8004],{"type":23,"value":750},{"type":17,"tag":36,"props":8006,"children":8007},{"style":86},[8008],{"type":23,"value":533},{"type":17,"tag":36,"props":8010,"children":8011},{"style":80},[8012],{"type":23,"value":543},{"type":17,"tag":304,"props":8014,"children":8016},{"id":8015},"lifecycle",[8017],{"type":23,"value":8015},{"type":17,"tag":368,"props":8019,"children":8020},{},[8021],{"type":17,"tag":323,"props":8022,"children":8023},{},[8024],{"type":23,"value":8025},"组合式API生命周期钩子可以重复调用",{"type":17,"tag":25,"props":8027,"children":8029},{"className":339,"code":8028,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Cdiv ref=\"elem\">{{ count }}\u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport { ref, onMounted } from 'vue';\n\nlet count = ref(0)\nconst elem = ref()\n\nonMounted(() => {\n console.log(count.value)\n})\nonMounted(() => {\n console.log(elem.value)\n})\n\u003C\u002Fscript>\n",[8030],{"type":17,"tag":32,"props":8031,"children":8032},{"__ignoreMap":7},[8033,8048,8085,8100,8107,8126,8150,8157,8189,8213,8220,8240,8256,8263,8282,8298,8305],{"type":17,"tag":36,"props":8034,"children":8035},{"class":38,"line":39},[8036,8040,8044],{"type":17,"tag":36,"props":8037,"children":8038},{"style":80},[8039],{"type":23,"value":528},{"type":17,"tag":36,"props":8041,"children":8042},{"style":86},[8043],{"type":23,"value":777},{"type":17,"tag":36,"props":8045,"children":8046},{"style":80},[8047],{"type":23,"value":543},{"type":17,"tag":36,"props":8049,"children":8050},{"class":38,"line":48},[8051,8055,8059,8063,8067,8072,8077,8081],{"type":17,"tag":36,"props":8052,"children":8053},{"style":80},[8054],{"type":23,"value":821},{"type":17,"tag":36,"props":8056,"children":8057},{"style":86},[8058],{"type":23,"value":794},{"type":17,"tag":36,"props":8060,"children":8061},{"style":411},[8062],{"type":23,"value":414},{"type":17,"tag":36,"props":8064,"children":8065},{"style":80},[8066],{"type":23,"value":482},{"type":17,"tag":36,"props":8068,"children":8069},{"style":422},[8070],{"type":23,"value":8071},"\"elem\"",{"type":17,"tag":36,"props":8073,"children":8074},{"style":80},[8075],{"type":23,"value":8076},">{{ count }}\u003C\u002F",{"type":17,"tag":36,"props":8078,"children":8079},{"style":86},[8080],{"type":23,"value":794},{"type":17,"tag":36,"props":8082,"children":8083},{"style":80},[8084],{"type":23,"value":543},{"type":17,"tag":36,"props":8086,"children":8087},{"class":38,"line":115},[8088,8092,8096],{"type":17,"tag":36,"props":8089,"children":8090},{"style":80},[8091],{"type":23,"value":750},{"type":17,"tag":36,"props":8093,"children":8094},{"style":86},[8095],{"type":23,"value":777},{"type":17,"tag":36,"props":8097,"children":8098},{"style":80},[8099],{"type":23,"value":543},{"type":17,"tag":36,"props":8101,"children":8102},{"class":38,"line":133},[8103],{"type":17,"tag":36,"props":8104,"children":8105},{"emptyLinePlaceholder":617},[8106],{"type":23,"value":620},{"type":17,"tag":36,"props":8108,"children":8109},{"class":38,"line":157},[8110,8114,8118,8122],{"type":17,"tag":36,"props":8111,"children":8112},{"style":80},[8113],{"type":23,"value":528},{"type":17,"tag":36,"props":8115,"children":8116},{"style":86},[8117],{"type":23,"value":533},{"type":17,"tag":36,"props":8119,"children":8120},{"style":411},[8121],{"type":23,"value":538},{"type":17,"tag":36,"props":8123,"children":8124},{"style":80},[8125],{"type":23,"value":543},{"type":17,"tag":36,"props":8127,"children":8128},{"class":38,"line":180},[8129,8133,8137,8141,8146],{"type":17,"tag":36,"props":8130,"children":8131},{"style":395},[8132],{"type":23,"value":1768},{"type":17,"tag":36,"props":8134,"children":8135},{"style":80},[8136],{"type":23,"value":1042},{"type":17,"tag":36,"props":8138,"children":8139},{"style":395},[8140],{"type":23,"value":1047},{"type":17,"tag":36,"props":8142,"children":8143},{"style":422},[8144],{"type":23,"value":8145}," 'vue'",{"type":17,"tag":36,"props":8147,"children":8148},{"style":80},[8149],{"type":23,"value":177},{"type":17,"tag":36,"props":8151,"children":8152},{"class":38,"line":202},[8153],{"type":17,"tag":36,"props":8154,"children":8155},{"emptyLinePlaceholder":617},[8156],{"type":23,"value":620},{"type":17,"tag":36,"props":8158,"children":8159},{"class":38,"line":224},[8160,8164,8169,8173,8177,8181,8185],{"type":17,"tag":36,"props":8161,"children":8162},{"style":395},[8163],{"type":23,"value":472},{"type":17,"tag":36,"props":8165,"children":8166},{"style":80},[8167],{"type":23,"value":8168}," count ",{"type":17,"tag":36,"props":8170,"children":8171},{"style":395},[8172],{"type":23,"value":482},{"type":17,"tag":36,"props":8174,"children":8175},{"style":411},[8176],{"type":23,"value":414},{"type":17,"tag":36,"props":8178,"children":8179},{"style":80},[8180],{"type":23,"value":419},{"type":17,"tag":36,"props":8182,"children":8183},{"style":105},[8184],{"type":23,"value":217},{"type":17,"tag":36,"props":8186,"children":8187},{"style":80},[8188],{"type":23,"value":430},{"type":17,"tag":36,"props":8190,"children":8191},{"class":38,"line":246},[8192,8196,8201,8205,8209],{"type":17,"tag":36,"props":8193,"children":8194},{"style":395},[8195],{"type":23,"value":398},{"type":17,"tag":36,"props":8197,"children":8198},{"style":105},[8199],{"type":23,"value":8200}," elem",{"type":17,"tag":36,"props":8202,"children":8203},{"style":395},[8204],{"type":23,"value":408},{"type":17,"tag":36,"props":8206,"children":8207},{"style":411},[8208],{"type":23,"value":414},{"type":17,"tag":36,"props":8210,"children":8211},{"style":80},[8212],{"type":23,"value":1160},{"type":17,"tag":36,"props":8214,"children":8215},{"class":38,"line":267},[8216],{"type":17,"tag":36,"props":8217,"children":8218},{"emptyLinePlaceholder":617},[8219],{"type":23,"value":620},{"type":17,"tag":36,"props":8221,"children":8222},{"class":38,"line":276},[8223,8228,8232,8236],{"type":17,"tag":36,"props":8224,"children":8225},{"style":411},[8226],{"type":23,"value":8227},"onMounted",{"type":17,"tag":36,"props":8229,"children":8230},{"style":80},[8231],{"type":23,"value":1133},{"type":17,"tag":36,"props":8233,"children":8234},{"style":395},[8235],{"type":23,"value":1138},{"type":17,"tag":36,"props":8237,"children":8238},{"style":80},[8239],{"type":23,"value":94},{"type":17,"tag":36,"props":8241,"children":8242},{"class":38,"line":285},[8243,8247,8251],{"type":17,"tag":36,"props":8244,"children":8245},{"style":80},[8246],{"type":23,"value":3562},{"type":17,"tag":36,"props":8248,"children":8249},{"style":411},[8250],{"type":23,"value":3428},{"type":17,"tag":36,"props":8252,"children":8253},{"style":80},[8254],{"type":23,"value":8255},"(count.value)\n",{"type":17,"tag":36,"props":8257,"children":8258},{"class":38,"line":815},[8259],{"type":17,"tag":36,"props":8260,"children":8261},{"style":80},[8262],{"type":23,"value":1617},{"type":17,"tag":36,"props":8264,"children":8265},{"class":38,"line":954},[8266,8270,8274,8278],{"type":17,"tag":36,"props":8267,"children":8268},{"style":411},[8269],{"type":23,"value":8227},{"type":17,"tag":36,"props":8271,"children":8272},{"style":80},[8273],{"type":23,"value":1133},{"type":17,"tag":36,"props":8275,"children":8276},{"style":395},[8277],{"type":23,"value":1138},{"type":17,"tag":36,"props":8279,"children":8280},{"style":80},[8281],{"type":23,"value":94},{"type":17,"tag":36,"props":8283,"children":8284},{"class":38,"line":971},[8285,8289,8293],{"type":17,"tag":36,"props":8286,"children":8287},{"style":80},[8288],{"type":23,"value":3562},{"type":17,"tag":36,"props":8290,"children":8291},{"style":411},[8292],{"type":23,"value":3428},{"type":17,"tag":36,"props":8294,"children":8295},{"style":80},[8296],{"type":23,"value":8297},"(elem.value)\n",{"type":17,"tag":36,"props":8299,"children":8300},{"class":38,"line":2770},[8301],{"type":17,"tag":36,"props":8302,"children":8303},{"style":80},[8304],{"type":23,"value":1617},{"type":17,"tag":36,"props":8306,"children":8307},{"class":38,"line":2778},[8308,8312,8316],{"type":17,"tag":36,"props":8309,"children":8310},{"style":80},[8311],{"type":23,"value":750},{"type":17,"tag":36,"props":8313,"children":8314},{"style":86},[8315],{"type":23,"value":533},{"type":17,"tag":36,"props":8317,"children":8318},{"style":80},[8319],{"type":23,"value":543},{"type":17,"tag":304,"props":8321,"children":8323},{"id":8322},"生命周期watcheffect与watch",[8324],{"type":23,"value":8325},"生命周期watchEffect与watch",{"type":17,"tag":368,"props":8327,"children":8328},{},[8329],{"type":17,"tag":323,"props":8330,"children":8331},{},[8332],{"type":23,"value":8333},"为了根据响应式状态自动应用和重新应用副作用， 我们可以使用watchEffect函数。他立即执行传入的一个函数，同时响应式追踪其依赖，并在其依赖变更是重新运行该函数",{"type":17,"tag":1695,"props":8335,"children":8336},{},[8337,8342],{"type":17,"tag":1699,"props":8338,"children":8339},{},[8340],{"type":23,"value":8341},"当watchEffect回调函数中使用到的响应式是数据发生改变，这个生命周期就会重新执行一遍",{"type":17,"tag":1699,"props":8343,"children":8344},{},[8345],{"type":23,"value":8346},"可以通过stop停止监听",{"type":17,"tag":25,"props":8348,"children":8350},{"className":339,"code":8349,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Cdiv>\n {{ count }}\n \u003Cp ref=\"ele\">程浩\u003C\u002Fp>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport { ref, watchEffect } from 'vue'\n\nlet count = ref(0)\nlet ele = ref()\n\nconst stop = watchEffect(() => {\n console.log(count.value)\n})\n\nsetTimeout(() => {\n stop()\n}, 1000)\n\nsetTimeout(() => {\n count.value = 1\n}, 2000)\n\u003C\u002Fscript>\n",[8351],{"type":17,"tag":32,"props":8352,"children":8353},{"__ignoreMap":7},[8354,8369,8384,8392,8429,8444,8459,8466,8485,8505,8512,8543,8567,8574,8607,8622,8629,8636,8656,8668,8684,8691,8710,8727,8743],{"type":17,"tag":36,"props":8355,"children":8356},{"class":38,"line":39},[8357,8361,8365],{"type":17,"tag":36,"props":8358,"children":8359},{"style":80},[8360],{"type":23,"value":528},{"type":17,"tag":36,"props":8362,"children":8363},{"style":86},[8364],{"type":23,"value":777},{"type":17,"tag":36,"props":8366,"children":8367},{"style":80},[8368],{"type":23,"value":543},{"type":17,"tag":36,"props":8370,"children":8371},{"class":38,"line":48},[8372,8376,8380],{"type":17,"tag":36,"props":8373,"children":8374},{"style":80},[8375],{"type":23,"value":821},{"type":17,"tag":36,"props":8377,"children":8378},{"style":86},[8379],{"type":23,"value":794},{"type":17,"tag":36,"props":8381,"children":8382},{"style":80},[8383],{"type":23,"value":543},{"type":17,"tag":36,"props":8385,"children":8386},{"class":38,"line":115},[8387],{"type":17,"tag":36,"props":8388,"children":8389},{"style":80},[8390],{"type":23,"value":8391}," {{ count }}\n",{"type":17,"tag":36,"props":8393,"children":8394},{"class":38,"line":133},[8395,8399,8403,8407,8411,8416,8421,8425],{"type":17,"tag":36,"props":8396,"children":8397},{"style":80},[8398],{"type":23,"value":6383},{"type":17,"tag":36,"props":8400,"children":8401},{"style":86},[8402],{"type":23,"value":323},{"type":17,"tag":36,"props":8404,"children":8405},{"style":411},[8406],{"type":23,"value":414},{"type":17,"tag":36,"props":8408,"children":8409},{"style":80},[8410],{"type":23,"value":482},{"type":17,"tag":36,"props":8412,"children":8413},{"style":422},[8414],{"type":23,"value":8415},"\"ele\"",{"type":17,"tag":36,"props":8417,"children":8418},{"style":80},[8419],{"type":23,"value":8420},">程浩\u003C\u002F",{"type":17,"tag":36,"props":8422,"children":8423},{"style":86},[8424],{"type":23,"value":323},{"type":17,"tag":36,"props":8426,"children":8427},{"style":80},[8428],{"type":23,"value":543},{"type":17,"tag":36,"props":8430,"children":8431},{"class":38,"line":157},[8432,8436,8440],{"type":17,"tag":36,"props":8433,"children":8434},{"style":80},[8435],{"type":23,"value":5784},{"type":17,"tag":36,"props":8437,"children":8438},{"style":86},[8439],{"type":23,"value":794},{"type":17,"tag":36,"props":8441,"children":8442},{"style":80},[8443],{"type":23,"value":543},{"type":17,"tag":36,"props":8445,"children":8446},{"class":38,"line":180},[8447,8451,8455],{"type":17,"tag":36,"props":8448,"children":8449},{"style":80},[8450],{"type":23,"value":750},{"type":17,"tag":36,"props":8452,"children":8453},{"style":86},[8454],{"type":23,"value":777},{"type":17,"tag":36,"props":8456,"children":8457},{"style":80},[8458],{"type":23,"value":543},{"type":17,"tag":36,"props":8460,"children":8461},{"class":38,"line":202},[8462],{"type":17,"tag":36,"props":8463,"children":8464},{"emptyLinePlaceholder":617},[8465],{"type":23,"value":620},{"type":17,"tag":36,"props":8467,"children":8468},{"class":38,"line":224},[8469,8473,8477,8481],{"type":17,"tag":36,"props":8470,"children":8471},{"style":80},[8472],{"type":23,"value":528},{"type":17,"tag":36,"props":8474,"children":8475},{"style":86},[8476],{"type":23,"value":533},{"type":17,"tag":36,"props":8478,"children":8479},{"style":411},[8480],{"type":23,"value":538},{"type":17,"tag":36,"props":8482,"children":8483},{"style":80},[8484],{"type":23,"value":543},{"type":17,"tag":36,"props":8486,"children":8487},{"class":38,"line":246},[8488,8492,8497,8501],{"type":17,"tag":36,"props":8489,"children":8490},{"style":395},[8491],{"type":23,"value":1768},{"type":17,"tag":36,"props":8493,"children":8494},{"style":80},[8495],{"type":23,"value":8496}," { ref, watchEffect } ",{"type":17,"tag":36,"props":8498,"children":8499},{"style":395},[8500],{"type":23,"value":1047},{"type":17,"tag":36,"props":8502,"children":8503},{"style":422},[8504],{"type":23,"value":1052},{"type":17,"tag":36,"props":8506,"children":8507},{"class":38,"line":267},[8508],{"type":17,"tag":36,"props":8509,"children":8510},{"emptyLinePlaceholder":617},[8511],{"type":23,"value":620},{"type":17,"tag":36,"props":8513,"children":8514},{"class":38,"line":276},[8515,8519,8523,8527,8531,8535,8539],{"type":17,"tag":36,"props":8516,"children":8517},{"style":395},[8518],{"type":23,"value":472},{"type":17,"tag":36,"props":8520,"children":8521},{"style":80},[8522],{"type":23,"value":8168},{"type":17,"tag":36,"props":8524,"children":8525},{"style":395},[8526],{"type":23,"value":482},{"type":17,"tag":36,"props":8528,"children":8529},{"style":411},[8530],{"type":23,"value":414},{"type":17,"tag":36,"props":8532,"children":8533},{"style":80},[8534],{"type":23,"value":419},{"type":17,"tag":36,"props":8536,"children":8537},{"style":105},[8538],{"type":23,"value":217},{"type":17,"tag":36,"props":8540,"children":8541},{"style":80},[8542],{"type":23,"value":430},{"type":17,"tag":36,"props":8544,"children":8545},{"class":38,"line":285},[8546,8550,8555,8559,8563],{"type":17,"tag":36,"props":8547,"children":8548},{"style":395},[8549],{"type":23,"value":472},{"type":17,"tag":36,"props":8551,"children":8552},{"style":80},[8553],{"type":23,"value":8554}," ele ",{"type":17,"tag":36,"props":8556,"children":8557},{"style":395},[8558],{"type":23,"value":482},{"type":17,"tag":36,"props":8560,"children":8561},{"style":411},[8562],{"type":23,"value":414},{"type":17,"tag":36,"props":8564,"children":8565},{"style":80},[8566],{"type":23,"value":1160},{"type":17,"tag":36,"props":8568,"children":8569},{"class":38,"line":815},[8570],{"type":17,"tag":36,"props":8571,"children":8572},{"emptyLinePlaceholder":617},[8573],{"type":23,"value":620},{"type":17,"tag":36,"props":8575,"children":8576},{"class":38,"line":954},[8577,8581,8586,8590,8595,8599,8603],{"type":17,"tag":36,"props":8578,"children":8579},{"style":395},[8580],{"type":23,"value":398},{"type":17,"tag":36,"props":8582,"children":8583},{"style":105},[8584],{"type":23,"value":8585}," stop",{"type":17,"tag":36,"props":8587,"children":8588},{"style":395},[8589],{"type":23,"value":408},{"type":17,"tag":36,"props":8591,"children":8592},{"style":411},[8593],{"type":23,"value":8594}," watchEffect",{"type":17,"tag":36,"props":8596,"children":8597},{"style":80},[8598],{"type":23,"value":1133},{"type":17,"tag":36,"props":8600,"children":8601},{"style":395},[8602],{"type":23,"value":1138},{"type":17,"tag":36,"props":8604,"children":8605},{"style":80},[8606],{"type":23,"value":94},{"type":17,"tag":36,"props":8608,"children":8609},{"class":38,"line":971},[8610,8614,8618],{"type":17,"tag":36,"props":8611,"children":8612},{"style":80},[8613],{"type":23,"value":3562},{"type":17,"tag":36,"props":8615,"children":8616},{"style":411},[8617],{"type":23,"value":3428},{"type":17,"tag":36,"props":8619,"children":8620},{"style":80},[8621],{"type":23,"value":8255},{"type":17,"tag":36,"props":8623,"children":8624},{"class":38,"line":2770},[8625],{"type":17,"tag":36,"props":8626,"children":8627},{"style":80},[8628],{"type":23,"value":1617},{"type":17,"tag":36,"props":8630,"children":8631},{"class":38,"line":2778},[8632],{"type":17,"tag":36,"props":8633,"children":8634},{"emptyLinePlaceholder":617},[8635],{"type":23,"value":620},{"type":17,"tag":36,"props":8637,"children":8638},{"class":38,"line":2794},[8639,8644,8648,8652],{"type":17,"tag":36,"props":8640,"children":8641},{"style":411},[8642],{"type":23,"value":8643},"setTimeout",{"type":17,"tag":36,"props":8645,"children":8646},{"style":80},[8647],{"type":23,"value":1133},{"type":17,"tag":36,"props":8649,"children":8650},{"style":395},[8651],{"type":23,"value":1138},{"type":17,"tag":36,"props":8653,"children":8654},{"style":80},[8655],{"type":23,"value":94},{"type":17,"tag":36,"props":8657,"children":8658},{"class":38,"line":2830},[8659,8664],{"type":17,"tag":36,"props":8660,"children":8661},{"style":411},[8662],{"type":23,"value":8663}," stop",{"type":17,"tag":36,"props":8665,"children":8666},{"style":80},[8667],{"type":23,"value":1160},{"type":17,"tag":36,"props":8669,"children":8670},{"class":38,"line":2863},[8671,8676,8680],{"type":17,"tag":36,"props":8672,"children":8673},{"style":80},[8674],{"type":23,"value":8675},"}, ",{"type":17,"tag":36,"props":8677,"children":8678},{"style":105},[8679],{"type":23,"value":3524},{"type":17,"tag":36,"props":8681,"children":8682},{"style":80},[8683],{"type":23,"value":430},{"type":17,"tag":36,"props":8685,"children":8686},{"class":38,"line":3058},[8687],{"type":17,"tag":36,"props":8688,"children":8689},{"emptyLinePlaceholder":617},[8690],{"type":23,"value":620},{"type":17,"tag":36,"props":8692,"children":8693},{"class":38,"line":3067},[8694,8698,8702,8706],{"type":17,"tag":36,"props":8695,"children":8696},{"style":411},[8697],{"type":23,"value":8643},{"type":17,"tag":36,"props":8699,"children":8700},{"style":80},[8701],{"type":23,"value":1133},{"type":17,"tag":36,"props":8703,"children":8704},{"style":395},[8705],{"type":23,"value":1138},{"type":17,"tag":36,"props":8707,"children":8708},{"style":80},[8709],{"type":23,"value":94},{"type":17,"tag":36,"props":8711,"children":8712},{"class":38,"line":3085},[8713,8718,8722],{"type":17,"tag":36,"props":8714,"children":8715},{"style":80},[8716],{"type":23,"value":8717}," count.value ",{"type":17,"tag":36,"props":8719,"children":8720},{"style":395},[8721],{"type":23,"value":482},{"type":17,"tag":36,"props":8723,"children":8724},{"style":105},[8725],{"type":23,"value":8726}," 1\n",{"type":17,"tag":36,"props":8728,"children":8729},{"class":38,"line":3094},[8730,8734,8739],{"type":17,"tag":36,"props":8731,"children":8732},{"style":80},[8733],{"type":23,"value":8675},{"type":17,"tag":36,"props":8735,"children":8736},{"style":105},[8737],{"type":23,"value":8738},"2000",{"type":17,"tag":36,"props":8740,"children":8741},{"style":80},[8742],{"type":23,"value":430},{"type":17,"tag":36,"props":8744,"children":8745},{"class":38,"line":3103},[8746,8750,8754],{"type":17,"tag":36,"props":8747,"children":8748},{"style":80},[8749],{"type":23,"value":750},{"type":17,"tag":36,"props":8751,"children":8752},{"style":86},[8753],{"type":23,"value":533},{"type":17,"tag":36,"props":8755,"children":8756},{"style":80},[8757],{"type":23,"value":543},{"type":17,"tag":316,"props":8759,"children":8760},{"id":1348},[8761],{"type":23,"value":1348},{"type":17,"tag":25,"props":8763,"children":8765},{"className":383,"code":8764,"language":385,"meta":7,"style":7},"import { ref, watch } from 'vue'\n\nconst selected = ref(0);\nwatch(selected, ( newValue, oldValue ) => {\n triggerLog(newValue);\n})\n",[8766],{"type":17,"tag":32,"props":8767,"children":8768},{"__ignoreMap":7},[8769,8789,8796,8828,8867,8880],{"type":17,"tag":36,"props":8770,"children":8771},{"class":38,"line":39},[8772,8776,8781,8785],{"type":17,"tag":36,"props":8773,"children":8774},{"style":395},[8775],{"type":23,"value":1768},{"type":17,"tag":36,"props":8777,"children":8778},{"style":80},[8779],{"type":23,"value":8780}," { ref, watch } ",{"type":17,"tag":36,"props":8782,"children":8783},{"style":395},[8784],{"type":23,"value":1047},{"type":17,"tag":36,"props":8786,"children":8787},{"style":422},[8788],{"type":23,"value":1052},{"type":17,"tag":36,"props":8790,"children":8791},{"class":38,"line":48},[8792],{"type":17,"tag":36,"props":8793,"children":8794},{"emptyLinePlaceholder":617},[8795],{"type":23,"value":620},{"type":17,"tag":36,"props":8797,"children":8798},{"class":38,"line":115},[8799,8803,8808,8812,8816,8820,8824],{"type":17,"tag":36,"props":8800,"children":8801},{"style":395},[8802],{"type":23,"value":398},{"type":17,"tag":36,"props":8804,"children":8805},{"style":105},[8806],{"type":23,"value":8807}," selected",{"type":17,"tag":36,"props":8809,"children":8810},{"style":395},[8811],{"type":23,"value":408},{"type":17,"tag":36,"props":8813,"children":8814},{"style":411},[8815],{"type":23,"value":414},{"type":17,"tag":36,"props":8817,"children":8818},{"style":80},[8819],{"type":23,"value":419},{"type":17,"tag":36,"props":8821,"children":8822},{"style":105},[8823],{"type":23,"value":217},{"type":17,"tag":36,"props":8825,"children":8826},{"style":80},[8827],{"type":23,"value":578},{"type":17,"tag":36,"props":8829,"children":8830},{"class":38,"line":133},[8831,8835,8840,8845,8849,8854,8859,8863],{"type":17,"tag":36,"props":8832,"children":8833},{"style":411},[8834],{"type":23,"value":1348},{"type":17,"tag":36,"props":8836,"children":8837},{"style":80},[8838],{"type":23,"value":8839},"(selected, ( ",{"type":17,"tag":36,"props":8841,"children":8842},{"style":1856},[8843],{"type":23,"value":8844},"newValue",{"type":17,"tag":36,"props":8846,"children":8847},{"style":80},[8848],{"type":23,"value":3903},{"type":17,"tag":36,"props":8850,"children":8851},{"style":1856},[8852],{"type":23,"value":8853},"oldValue",{"type":17,"tag":36,"props":8855,"children":8856},{"style":80},[8857],{"type":23,"value":8858}," ) ",{"type":17,"tag":36,"props":8860,"children":8861},{"style":395},[8862],{"type":23,"value":1138},{"type":17,"tag":36,"props":8864,"children":8865},{"style":80},[8866],{"type":23,"value":94},{"type":17,"tag":36,"props":8868,"children":8869},{"class":38,"line":157},[8870,8875],{"type":17,"tag":36,"props":8871,"children":8872},{"style":411},[8873],{"type":23,"value":8874}," triggerLog",{"type":17,"tag":36,"props":8876,"children":8877},{"style":80},[8878],{"type":23,"value":8879},"(newValue);\n",{"type":17,"tag":36,"props":8881,"children":8882},{"class":38,"line":180},[8883],{"type":17,"tag":36,"props":8884,"children":8885},{"style":80},[8886],{"type":23,"value":1617},{"type":17,"tag":304,"props":8888,"children":8890},{"id":8889},"跨组件通信方案provide-inject",[8891],{"type":23,"value":8892},"跨组件通信方案provide inject",{"type":17,"tag":323,"props":8894,"children":8895},{},[8896],{"type":23,"value":8897},"注意不要在inject中修改响应式数据，所有逻辑代码在父组写，子组件只负责接收和调用",{"type":17,"tag":1695,"props":8899,"children":8900},{},[8901,8906],{"type":17,"tag":1699,"props":8902,"children":8903},{},[8904],{"type":23,"value":8905},"可利用回调函数修改",{"type":17,"tag":1699,"props":8907,"children":8908},{},[8909],{"type":23,"value":8910},"为了防止可设置成readonly",{"type":17,"tag":323,"props":8912,"children":8913},{},[8914],{"type":17,"tag":1637,"props":8915,"children":8916},{},[8917],{"type":23,"value":8918},"procide.vue",{"type":17,"tag":25,"props":8920,"children":8922},{"className":339,"code":8921,"language":341,"meta":7,"style":7},"\n\u003Ctemplate>\n \u003Ch2>provide\u003C\u002Fh2>\n \u003CInject \u002F>\n\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport { provide, ref, readonly } from 'vue'\nimport Inject from \".\u002F05_inject.vue\"\n\nlet count = ref(0)\nprovide(\"count\", readonly(count))\nprovide(\"changeCount\", () => {\n count.value = 1\n})\n\n\u003C\u002Fscript>\n",[8923],{"type":17,"tag":32,"props":8924,"children":8925},{"__ignoreMap":7},[8926,8933,8948,8972,8988,8995,9010,9017,9036,9056,9077,9084,9115,9144,9173,9188,9195,9202],{"type":17,"tag":36,"props":8927,"children":8928},{"class":38,"line":39},[8929],{"type":17,"tag":36,"props":8930,"children":8931},{"emptyLinePlaceholder":617},[8932],{"type":23,"value":620},{"type":17,"tag":36,"props":8934,"children":8935},{"class":38,"line":48},[8936,8940,8944],{"type":17,"tag":36,"props":8937,"children":8938},{"style":80},[8939],{"type":23,"value":528},{"type":17,"tag":36,"props":8941,"children":8942},{"style":86},[8943],{"type":23,"value":777},{"type":17,"tag":36,"props":8945,"children":8946},{"style":80},[8947],{"type":23,"value":543},{"type":17,"tag":36,"props":8949,"children":8950},{"class":38,"line":115},[8951,8955,8959,8964,8968],{"type":17,"tag":36,"props":8952,"children":8953},{"style":80},[8954],{"type":23,"value":821},{"type":17,"tag":36,"props":8956,"children":8957},{"style":86},[8958],{"type":23,"value":61},{"type":17,"tag":36,"props":8960,"children":8961},{"style":80},[8962],{"type":23,"value":8963},">provide\u003C\u002F",{"type":17,"tag":36,"props":8965,"children":8966},{"style":86},[8967],{"type":23,"value":61},{"type":17,"tag":36,"props":8969,"children":8970},{"style":80},[8971],{"type":23,"value":543},{"type":17,"tag":36,"props":8973,"children":8974},{"class":38,"line":133},[8975,8979,8984],{"type":17,"tag":36,"props":8976,"children":8977},{"style":80},[8978],{"type":23,"value":821},{"type":17,"tag":36,"props":8980,"children":8981},{"style":86},[8982],{"type":23,"value":8983},"Inject",{"type":17,"tag":36,"props":8985,"children":8986},{"style":80},[8987],{"type":23,"value":1235},{"type":17,"tag":36,"props":8989,"children":8990},{"class":38,"line":157},[8991],{"type":17,"tag":36,"props":8992,"children":8993},{"emptyLinePlaceholder":617},[8994],{"type":23,"value":620},{"type":17,"tag":36,"props":8996,"children":8997},{"class":38,"line":180},[8998,9002,9006],{"type":17,"tag":36,"props":8999,"children":9000},{"style":80},[9001],{"type":23,"value":750},{"type":17,"tag":36,"props":9003,"children":9004},{"style":86},[9005],{"type":23,"value":777},{"type":17,"tag":36,"props":9007,"children":9008},{"style":80},[9009],{"type":23,"value":543},{"type":17,"tag":36,"props":9011,"children":9012},{"class":38,"line":202},[9013],{"type":17,"tag":36,"props":9014,"children":9015},{"emptyLinePlaceholder":617},[9016],{"type":23,"value":620},{"type":17,"tag":36,"props":9018,"children":9019},{"class":38,"line":224},[9020,9024,9028,9032],{"type":17,"tag":36,"props":9021,"children":9022},{"style":80},[9023],{"type":23,"value":528},{"type":17,"tag":36,"props":9025,"children":9026},{"style":86},[9027],{"type":23,"value":533},{"type":17,"tag":36,"props":9029,"children":9030},{"style":411},[9031],{"type":23,"value":538},{"type":17,"tag":36,"props":9033,"children":9034},{"style":80},[9035],{"type":23,"value":543},{"type":17,"tag":36,"props":9037,"children":9038},{"class":38,"line":246},[9039,9043,9048,9052],{"type":17,"tag":36,"props":9040,"children":9041},{"style":395},[9042],{"type":23,"value":1768},{"type":17,"tag":36,"props":9044,"children":9045},{"style":80},[9046],{"type":23,"value":9047}," { provide, ref, readonly } ",{"type":17,"tag":36,"props":9049,"children":9050},{"style":395},[9051],{"type":23,"value":1047},{"type":17,"tag":36,"props":9053,"children":9054},{"style":422},[9055],{"type":23,"value":1052},{"type":17,"tag":36,"props":9057,"children":9058},{"class":38,"line":267},[9059,9063,9068,9072],{"type":17,"tag":36,"props":9060,"children":9061},{"style":395},[9062],{"type":23,"value":1768},{"type":17,"tag":36,"props":9064,"children":9065},{"style":80},[9066],{"type":23,"value":9067}," Inject ",{"type":17,"tag":36,"props":9069,"children":9070},{"style":395},[9071],{"type":23,"value":1047},{"type":17,"tag":36,"props":9073,"children":9074},{"style":422},[9075],{"type":23,"value":9076}," \".\u002F05_inject.vue\"\n",{"type":17,"tag":36,"props":9078,"children":9079},{"class":38,"line":276},[9080],{"type":17,"tag":36,"props":9081,"children":9082},{"emptyLinePlaceholder":617},[9083],{"type":23,"value":620},{"type":17,"tag":36,"props":9085,"children":9086},{"class":38,"line":285},[9087,9091,9095,9099,9103,9107,9111],{"type":17,"tag":36,"props":9088,"children":9089},{"style":395},[9090],{"type":23,"value":472},{"type":17,"tag":36,"props":9092,"children":9093},{"style":80},[9094],{"type":23,"value":8168},{"type":17,"tag":36,"props":9096,"children":9097},{"style":395},[9098],{"type":23,"value":482},{"type":17,"tag":36,"props":9100,"children":9101},{"style":411},[9102],{"type":23,"value":414},{"type":17,"tag":36,"props":9104,"children":9105},{"style":80},[9106],{"type":23,"value":419},{"type":17,"tag":36,"props":9108,"children":9109},{"style":105},[9110],{"type":23,"value":217},{"type":17,"tag":36,"props":9112,"children":9113},{"style":80},[9114],{"type":23,"value":430},{"type":17,"tag":36,"props":9116,"children":9117},{"class":38,"line":815},[9118,9122,9126,9130,9134,9139],{"type":17,"tag":36,"props":9119,"children":9120},{"style":411},[9121],{"type":23,"value":438},{"type":17,"tag":36,"props":9123,"children":9124},{"style":80},[9125],{"type":23,"value":419},{"type":17,"tag":36,"props":9127,"children":9128},{"style":422},[9129],{"type":23,"value":7401},{"type":17,"tag":36,"props":9131,"children":9132},{"style":80},[9133],{"type":23,"value":3903},{"type":17,"tag":36,"props":9135,"children":9136},{"style":411},[9137],{"type":23,"value":9138},"readonly",{"type":17,"tag":36,"props":9140,"children":9141},{"style":80},[9142],{"type":23,"value":9143},"(count))\n",{"type":17,"tag":36,"props":9145,"children":9146},{"class":38,"line":954},[9147,9151,9155,9160,9165,9169],{"type":17,"tag":36,"props":9148,"children":9149},{"style":411},[9150],{"type":23,"value":438},{"type":17,"tag":36,"props":9152,"children":9153},{"style":80},[9154],{"type":23,"value":419},{"type":17,"tag":36,"props":9156,"children":9157},{"style":422},[9158],{"type":23,"value":9159},"\"changeCount\"",{"type":17,"tag":36,"props":9161,"children":9162},{"style":80},[9163],{"type":23,"value":9164},", () ",{"type":17,"tag":36,"props":9166,"children":9167},{"style":395},[9168],{"type":23,"value":1138},{"type":17,"tag":36,"props":9170,"children":9171},{"style":80},[9172],{"type":23,"value":94},{"type":17,"tag":36,"props":9174,"children":9175},{"class":38,"line":971},[9176,9180,9184],{"type":17,"tag":36,"props":9177,"children":9178},{"style":80},[9179],{"type":23,"value":8717},{"type":17,"tag":36,"props":9181,"children":9182},{"style":395},[9183],{"type":23,"value":482},{"type":17,"tag":36,"props":9185,"children":9186},{"style":105},[9187],{"type":23,"value":8726},{"type":17,"tag":36,"props":9189,"children":9190},{"class":38,"line":2770},[9191],{"type":17,"tag":36,"props":9192,"children":9193},{"style":80},[9194],{"type":23,"value":1617},{"type":17,"tag":36,"props":9196,"children":9197},{"class":38,"line":2778},[9198],{"type":17,"tag":36,"props":9199,"children":9200},{"emptyLinePlaceholder":617},[9201],{"type":23,"value":620},{"type":17,"tag":36,"props":9203,"children":9204},{"class":38,"line":2794},[9205,9209,9213],{"type":17,"tag":36,"props":9206,"children":9207},{"style":80},[9208],{"type":23,"value":750},{"type":17,"tag":36,"props":9210,"children":9211},{"style":86},[9212],{"type":23,"value":533},{"type":17,"tag":36,"props":9214,"children":9215},{"style":80},[9216],{"type":23,"value":543},{"type":17,"tag":323,"props":9218,"children":9219},{},[9220],{"type":17,"tag":1637,"props":9221,"children":9222},{},[9223],{"type":23,"value":9224},"inject.vue",{"type":17,"tag":25,"props":9226,"children":9228},{"className":339,"code":9227,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Ch2>inject\u003C\u002Fh2>\n {{ count }}\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport { inject } from 'vue'\n\nlet count = inject(\"count\") \nconst changeCount = inject(\"changeCount\")\nsetTimeout(() => { changeCount() }, 2000)\n\n\u003C\u002Fscript>\n",[9229],{"type":17,"tag":32,"props":9230,"children":9231},{"__ignoreMap":7},[9232,9247,9271,9279,9294,9301,9320,9340,9347,9379,9411,9448,9455],{"type":17,"tag":36,"props":9233,"children":9234},{"class":38,"line":39},[9235,9239,9243],{"type":17,"tag":36,"props":9236,"children":9237},{"style":80},[9238],{"type":23,"value":528},{"type":17,"tag":36,"props":9240,"children":9241},{"style":86},[9242],{"type":23,"value":777},{"type":17,"tag":36,"props":9244,"children":9245},{"style":80},[9246],{"type":23,"value":543},{"type":17,"tag":36,"props":9248,"children":9249},{"class":38,"line":48},[9250,9254,9258,9263,9267],{"type":17,"tag":36,"props":9251,"children":9252},{"style":80},[9253],{"type":23,"value":821},{"type":17,"tag":36,"props":9255,"children":9256},{"style":86},[9257],{"type":23,"value":61},{"type":17,"tag":36,"props":9259,"children":9260},{"style":80},[9261],{"type":23,"value":9262},">inject\u003C\u002F",{"type":17,"tag":36,"props":9264,"children":9265},{"style":86},[9266],{"type":23,"value":61},{"type":17,"tag":36,"props":9268,"children":9269},{"style":80},[9270],{"type":23,"value":543},{"type":17,"tag":36,"props":9272,"children":9273},{"class":38,"line":115},[9274],{"type":17,"tag":36,"props":9275,"children":9276},{"style":80},[9277],{"type":23,"value":9278}," {{ count }}\n",{"type":17,"tag":36,"props":9280,"children":9281},{"class":38,"line":133},[9282,9286,9290],{"type":17,"tag":36,"props":9283,"children":9284},{"style":80},[9285],{"type":23,"value":750},{"type":17,"tag":36,"props":9287,"children":9288},{"style":86},[9289],{"type":23,"value":777},{"type":17,"tag":36,"props":9291,"children":9292},{"style":80},[9293],{"type":23,"value":543},{"type":17,"tag":36,"props":9295,"children":9296},{"class":38,"line":157},[9297],{"type":17,"tag":36,"props":9298,"children":9299},{"emptyLinePlaceholder":617},[9300],{"type":23,"value":620},{"type":17,"tag":36,"props":9302,"children":9303},{"class":38,"line":180},[9304,9308,9312,9316],{"type":17,"tag":36,"props":9305,"children":9306},{"style":80},[9307],{"type":23,"value":528},{"type":17,"tag":36,"props":9309,"children":9310},{"style":86},[9311],{"type":23,"value":533},{"type":17,"tag":36,"props":9313,"children":9314},{"style":411},[9315],{"type":23,"value":538},{"type":17,"tag":36,"props":9317,"children":9318},{"style":80},[9319],{"type":23,"value":543},{"type":17,"tag":36,"props":9321,"children":9322},{"class":38,"line":202},[9323,9327,9332,9336],{"type":17,"tag":36,"props":9324,"children":9325},{"style":395},[9326],{"type":23,"value":1768},{"type":17,"tag":36,"props":9328,"children":9329},{"style":80},[9330],{"type":23,"value":9331}," { inject } ",{"type":17,"tag":36,"props":9333,"children":9334},{"style":395},[9335],{"type":23,"value":1047},{"type":17,"tag":36,"props":9337,"children":9338},{"style":422},[9339],{"type":23,"value":1052},{"type":17,"tag":36,"props":9341,"children":9342},{"class":38,"line":224},[9343],{"type":17,"tag":36,"props":9344,"children":9345},{"emptyLinePlaceholder":617},[9346],{"type":23,"value":620},{"type":17,"tag":36,"props":9348,"children":9349},{"class":38,"line":246},[9350,9354,9358,9362,9366,9370,9374],{"type":17,"tag":36,"props":9351,"children":9352},{"style":395},[9353],{"type":23,"value":472},{"type":17,"tag":36,"props":9355,"children":9356},{"style":80},[9357],{"type":23,"value":8168},{"type":17,"tag":36,"props":9359,"children":9360},{"style":395},[9361],{"type":23,"value":482},{"type":17,"tag":36,"props":9363,"children":9364},{"style":411},[9365],{"type":23,"value":487},{"type":17,"tag":36,"props":9367,"children":9368},{"style":80},[9369],{"type":23,"value":419},{"type":17,"tag":36,"props":9371,"children":9372},{"style":422},[9373],{"type":23,"value":7401},{"type":17,"tag":36,"props":9375,"children":9376},{"style":80},[9377],{"type":23,"value":9378},") \n",{"type":17,"tag":36,"props":9380,"children":9381},{"class":38,"line":267},[9382,9386,9391,9395,9399,9403,9407],{"type":17,"tag":36,"props":9383,"children":9384},{"style":395},[9385],{"type":23,"value":398},{"type":17,"tag":36,"props":9387,"children":9388},{"style":105},[9389],{"type":23,"value":9390}," changeCount",{"type":17,"tag":36,"props":9392,"children":9393},{"style":395},[9394],{"type":23,"value":408},{"type":17,"tag":36,"props":9396,"children":9397},{"style":411},[9398],{"type":23,"value":487},{"type":17,"tag":36,"props":9400,"children":9401},{"style":80},[9402],{"type":23,"value":419},{"type":17,"tag":36,"props":9404,"children":9405},{"style":422},[9406],{"type":23,"value":9159},{"type":17,"tag":36,"props":9408,"children":9409},{"style":80},[9410],{"type":23,"value":430},{"type":17,"tag":36,"props":9412,"children":9413},{"class":38,"line":276},[9414,9418,9422,9426,9430,9435,9440,9444],{"type":17,"tag":36,"props":9415,"children":9416},{"style":411},[9417],{"type":23,"value":8643},{"type":17,"tag":36,"props":9419,"children":9420},{"style":80},[9421],{"type":23,"value":1133},{"type":17,"tag":36,"props":9423,"children":9424},{"style":395},[9425],{"type":23,"value":1138},{"type":17,"tag":36,"props":9427,"children":9428},{"style":80},[9429],{"type":23,"value":1931},{"type":17,"tag":36,"props":9431,"children":9432},{"style":411},[9433],{"type":23,"value":9434},"changeCount",{"type":17,"tag":36,"props":9436,"children":9437},{"style":80},[9438],{"type":23,"value":9439},"() }, ",{"type":17,"tag":36,"props":9441,"children":9442},{"style":105},[9443],{"type":23,"value":8738},{"type":17,"tag":36,"props":9445,"children":9446},{"style":80},[9447],{"type":23,"value":430},{"type":17,"tag":36,"props":9449,"children":9450},{"class":38,"line":285},[9451],{"type":17,"tag":36,"props":9452,"children":9453},{"emptyLinePlaceholder":617},[9454],{"type":23,"value":620},{"type":17,"tag":36,"props":9456,"children":9457},{"class":38,"line":815},[9458,9462,9466],{"type":17,"tag":36,"props":9459,"children":9460},{"style":80},[9461],{"type":23,"value":750},{"type":17,"tag":36,"props":9463,"children":9464},{"style":86},[9465],{"type":23,"value":533},{"type":17,"tag":36,"props":9467,"children":9468},{"style":80},[9469],{"type":23,"value":543},{"type":17,"tag":304,"props":9471,"children":9473},{"id":9472},"父子通信props-emit",[9474],{"type":23,"value":9475},"父子通信props emit",{"type":17,"tag":323,"props":9477,"children":9478},{},[9479],{"type":17,"tag":1637,"props":9480,"children":9481},{},[9482],{"type":23,"value":9483},"Prop.vue",{"type":17,"tag":323,"props":9485,"children":9486},{},[9487],{"type":23,"value":9488},"父传子自定义属性、子传父自定义事件",{"type":17,"tag":25,"props":9490,"children":9492},{"className":339,"code":9491,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Ch2>props\u003C\u002Fh2>\n \u003CEmit :count=\"1\" :message=\"'hello world'\" @sendDate=\"getEmitDate\" \u002F>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport Emit from \".\u002F07_emit.vue\"\n\nconst getEmitDate = (data) => {\n console.log(data)\n}\n\u003C\u002Fscript>\n",[9493],{"type":17,"tag":32,"props":9494,"children":9495},{"__ignoreMap":7},[9496,9511,9535,9619,9634,9641,9660,9681,9688,9724,9739,9746],{"type":17,"tag":36,"props":9497,"children":9498},{"class":38,"line":39},[9499,9503,9507],{"type":17,"tag":36,"props":9500,"children":9501},{"style":80},[9502],{"type":23,"value":528},{"type":17,"tag":36,"props":9504,"children":9505},{"style":86},[9506],{"type":23,"value":777},{"type":17,"tag":36,"props":9508,"children":9509},{"style":80},[9510],{"type":23,"value":543},{"type":17,"tag":36,"props":9512,"children":9513},{"class":38,"line":48},[9514,9518,9522,9527,9531],{"type":17,"tag":36,"props":9515,"children":9516},{"style":80},[9517],{"type":23,"value":821},{"type":17,"tag":36,"props":9519,"children":9520},{"style":86},[9521],{"type":23,"value":61},{"type":17,"tag":36,"props":9523,"children":9524},{"style":80},[9525],{"type":23,"value":9526},">props\u003C\u002F",{"type":17,"tag":36,"props":9528,"children":9529},{"style":86},[9530],{"type":23,"value":61},{"type":17,"tag":36,"props":9532,"children":9533},{"style":80},[9534],{"type":23,"value":543},{"type":17,"tag":36,"props":9536,"children":9537},{"class":38,"line":115},[9538,9542,9547,9551,9555,9559,9563,9567,9571,9575,9580,9584,9589,9593,9598,9602,9606,9611,9615],{"type":17,"tag":36,"props":9539,"children":9540},{"style":80},[9541],{"type":23,"value":821},{"type":17,"tag":36,"props":9543,"children":9544},{"style":86},[9545],{"type":23,"value":9546},"Emit",{"type":17,"tag":36,"props":9548,"children":9549},{"style":80},[9550],{"type":23,"value":680},{"type":17,"tag":36,"props":9552,"children":9553},{"style":411},[9554],{"type":23,"value":2206},{"type":17,"tag":36,"props":9556,"children":9557},{"style":80},[9558],{"type":23,"value":482},{"type":17,"tag":36,"props":9560,"children":9561},{"style":422},[9562],{"type":23,"value":842},{"type":17,"tag":36,"props":9564,"children":9565},{"style":105},[9566],{"type":23,"value":1297},{"type":17,"tag":36,"props":9568,"children":9569},{"style":422},[9570],{"type":23,"value":842},{"type":17,"tag":36,"props":9572,"children":9573},{"style":80},[9574],{"type":23,"value":680},{"type":17,"tag":36,"props":9576,"children":9577},{"style":411},[9578],{"type":23,"value":9579},"message",{"type":17,"tag":36,"props":9581,"children":9582},{"style":80},[9583],{"type":23,"value":482},{"type":17,"tag":36,"props":9585,"children":9586},{"style":422},[9587],{"type":23,"value":9588},"\"'hello world'\"",{"type":17,"tag":36,"props":9590,"children":9591},{"style":80},[9592],{"type":23,"value":916},{"type":17,"tag":36,"props":9594,"children":9595},{"style":411},[9596],{"type":23,"value":9597},"sendDate",{"type":17,"tag":36,"props":9599,"children":9600},{"style":80},[9601],{"type":23,"value":482},{"type":17,"tag":36,"props":9603,"children":9604},{"style":422},[9605],{"type":23,"value":842},{"type":17,"tag":36,"props":9607,"children":9608},{"style":80},[9609],{"type":23,"value":9610},"getEmitDate",{"type":17,"tag":36,"props":9612,"children":9613},{"style":422},[9614],{"type":23,"value":842},{"type":17,"tag":36,"props":9616,"children":9617},{"style":80},[9618],{"type":23,"value":1235},{"type":17,"tag":36,"props":9620,"children":9621},{"class":38,"line":133},[9622,9626,9630],{"type":17,"tag":36,"props":9623,"children":9624},{"style":80},[9625],{"type":23,"value":750},{"type":17,"tag":36,"props":9627,"children":9628},{"style":86},[9629],{"type":23,"value":777},{"type":17,"tag":36,"props":9631,"children":9632},{"style":80},[9633],{"type":23,"value":543},{"type":17,"tag":36,"props":9635,"children":9636},{"class":38,"line":157},[9637],{"type":17,"tag":36,"props":9638,"children":9639},{"emptyLinePlaceholder":617},[9640],{"type":23,"value":620},{"type":17,"tag":36,"props":9642,"children":9643},{"class":38,"line":180},[9644,9648,9652,9656],{"type":17,"tag":36,"props":9645,"children":9646},{"style":80},[9647],{"type":23,"value":528},{"type":17,"tag":36,"props":9649,"children":9650},{"style":86},[9651],{"type":23,"value":533},{"type":17,"tag":36,"props":9653,"children":9654},{"style":411},[9655],{"type":23,"value":538},{"type":17,"tag":36,"props":9657,"children":9658},{"style":80},[9659],{"type":23,"value":543},{"type":17,"tag":36,"props":9661,"children":9662},{"class":38,"line":202},[9663,9667,9672,9676],{"type":17,"tag":36,"props":9664,"children":9665},{"style":395},[9666],{"type":23,"value":1768},{"type":17,"tag":36,"props":9668,"children":9669},{"style":80},[9670],{"type":23,"value":9671}," Emit ",{"type":17,"tag":36,"props":9673,"children":9674},{"style":395},[9675],{"type":23,"value":1047},{"type":17,"tag":36,"props":9677,"children":9678},{"style":422},[9679],{"type":23,"value":9680}," \".\u002F07_emit.vue\"\n",{"type":17,"tag":36,"props":9682,"children":9683},{"class":38,"line":224},[9684],{"type":17,"tag":36,"props":9685,"children":9686},{"emptyLinePlaceholder":617},[9687],{"type":23,"value":620},{"type":17,"tag":36,"props":9689,"children":9690},{"class":38,"line":246},[9691,9695,9700,9704,9708,9712,9716,9720],{"type":17,"tag":36,"props":9692,"children":9693},{"style":395},[9694],{"type":23,"value":398},{"type":17,"tag":36,"props":9696,"children":9697},{"style":411},[9698],{"type":23,"value":9699}," getEmitDate",{"type":17,"tag":36,"props":9701,"children":9702},{"style":395},[9703],{"type":23,"value":408},{"type":17,"tag":36,"props":9705,"children":9706},{"style":80},[9707],{"type":23,"value":4023},{"type":17,"tag":36,"props":9709,"children":9710},{"style":1856},[9711],{"type":23,"value":7133},{"type":17,"tag":36,"props":9713,"children":9714},{"style":80},[9715],{"type":23,"value":3913},{"type":17,"tag":36,"props":9717,"children":9718},{"style":395},[9719],{"type":23,"value":1138},{"type":17,"tag":36,"props":9721,"children":9722},{"style":80},[9723],{"type":23,"value":94},{"type":17,"tag":36,"props":9725,"children":9726},{"class":38,"line":267},[9727,9731,9735],{"type":17,"tag":36,"props":9728,"children":9729},{"style":80},[9730],{"type":23,"value":3562},{"type":17,"tag":36,"props":9732,"children":9733},{"style":411},[9734],{"type":23,"value":3428},{"type":17,"tag":36,"props":9736,"children":9737},{"style":80},[9738],{"type":23,"value":7153},{"type":17,"tag":36,"props":9740,"children":9741},{"class":38,"line":276},[9742],{"type":17,"tag":36,"props":9743,"children":9744},{"style":80},[9745],{"type":23,"value":291},{"type":17,"tag":36,"props":9747,"children":9748},{"class":38,"line":285},[9749,9753,9757],{"type":17,"tag":36,"props":9750,"children":9751},{"style":80},[9752],{"type":23,"value":750},{"type":17,"tag":36,"props":9754,"children":9755},{"style":86},[9756],{"type":23,"value":533},{"type":17,"tag":36,"props":9758,"children":9759},{"style":80},[9760],{"type":23,"value":543},{"type":17,"tag":323,"props":9762,"children":9763},{},[9764],{"type":17,"tag":1637,"props":9765,"children":9766},{},[9767],{"type":23,"value":9768},"Emit.vue",{"type":17,"tag":25,"props":9770,"children":9772},{"className":339,"code":9771,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Ch2>emit {{ count }} {{ message }}\u003C\u002Fh2>\n\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport { defineProps, defineEmits, onMounted } from 'vue'\n\nconst state = defineProps({\n count: {\n type: Number\n },\n message: {\n type: String\n }\n})\n\nconst emit = defineEmits([\"sendDate\"])\nonMounted(() => {\n emit(\"sendDate\", \"Emit传来的数据\")\n})\n\u003C\u002Fscript>\n",[9773],{"type":17,"tag":32,"props":9774,"children":9775},{"__ignoreMap":7},[9776,9791,9815,9822,9837,9844,9863,9883,9890,9915,9923,9931,9938,9946,9954,9961,9968,9975,10011,10030,10059,10066],{"type":17,"tag":36,"props":9777,"children":9778},{"class":38,"line":39},[9779,9783,9787],{"type":17,"tag":36,"props":9780,"children":9781},{"style":80},[9782],{"type":23,"value":528},{"type":17,"tag":36,"props":9784,"children":9785},{"style":86},[9786],{"type":23,"value":777},{"type":17,"tag":36,"props":9788,"children":9789},{"style":80},[9790],{"type":23,"value":543},{"type":17,"tag":36,"props":9792,"children":9793},{"class":38,"line":48},[9794,9798,9802,9807,9811],{"type":17,"tag":36,"props":9795,"children":9796},{"style":80},[9797],{"type":23,"value":821},{"type":17,"tag":36,"props":9799,"children":9800},{"style":86},[9801],{"type":23,"value":61},{"type":17,"tag":36,"props":9803,"children":9804},{"style":80},[9805],{"type":23,"value":9806},">emit {{ count }} {{ message }}\u003C\u002F",{"type":17,"tag":36,"props":9808,"children":9809},{"style":86},[9810],{"type":23,"value":61},{"type":17,"tag":36,"props":9812,"children":9813},{"style":80},[9814],{"type":23,"value":543},{"type":17,"tag":36,"props":9816,"children":9817},{"class":38,"line":115},[9818],{"type":17,"tag":36,"props":9819,"children":9820},{"emptyLinePlaceholder":617},[9821],{"type":23,"value":620},{"type":17,"tag":36,"props":9823,"children":9824},{"class":38,"line":133},[9825,9829,9833],{"type":17,"tag":36,"props":9826,"children":9827},{"style":80},[9828],{"type":23,"value":750},{"type":17,"tag":36,"props":9830,"children":9831},{"style":86},[9832],{"type":23,"value":777},{"type":17,"tag":36,"props":9834,"children":9835},{"style":80},[9836],{"type":23,"value":543},{"type":17,"tag":36,"props":9838,"children":9839},{"class":38,"line":157},[9840],{"type":17,"tag":36,"props":9841,"children":9842},{"emptyLinePlaceholder":617},[9843],{"type":23,"value":620},{"type":17,"tag":36,"props":9845,"children":9846},{"class":38,"line":180},[9847,9851,9855,9859],{"type":17,"tag":36,"props":9848,"children":9849},{"style":80},[9850],{"type":23,"value":528},{"type":17,"tag":36,"props":9852,"children":9853},{"style":86},[9854],{"type":23,"value":533},{"type":17,"tag":36,"props":9856,"children":9857},{"style":411},[9858],{"type":23,"value":538},{"type":17,"tag":36,"props":9860,"children":9861},{"style":80},[9862],{"type":23,"value":543},{"type":17,"tag":36,"props":9864,"children":9865},{"class":38,"line":202},[9866,9870,9875,9879],{"type":17,"tag":36,"props":9867,"children":9868},{"style":395},[9869],{"type":23,"value":1768},{"type":17,"tag":36,"props":9871,"children":9872},{"style":80},[9873],{"type":23,"value":9874}," { defineProps, defineEmits, onMounted } ",{"type":17,"tag":36,"props":9876,"children":9877},{"style":395},[9878],{"type":23,"value":1047},{"type":17,"tag":36,"props":9880,"children":9881},{"style":422},[9882],{"type":23,"value":1052},{"type":17,"tag":36,"props":9884,"children":9885},{"class":38,"line":224},[9886],{"type":17,"tag":36,"props":9887,"children":9888},{"emptyLinePlaceholder":617},[9889],{"type":23,"value":620},{"type":17,"tag":36,"props":9891,"children":9892},{"class":38,"line":246},[9893,9897,9901,9905,9910],{"type":17,"tag":36,"props":9894,"children":9895},{"style":395},[9896],{"type":23,"value":398},{"type":17,"tag":36,"props":9898,"children":9899},{"style":105},[9900],{"type":23,"value":2134},{"type":17,"tag":36,"props":9902,"children":9903},{"style":395},[9904],{"type":23,"value":408},{"type":17,"tag":36,"props":9906,"children":9907},{"style":411},[9908],{"type":23,"value":9909}," defineProps",{"type":17,"tag":36,"props":9911,"children":9912},{"style":80},[9913],{"type":23,"value":9914},"({\n",{"type":17,"tag":36,"props":9916,"children":9917},{"class":38,"line":267},[9918],{"type":17,"tag":36,"props":9919,"children":9920},{"style":80},[9921],{"type":23,"value":9922}," count: {\n",{"type":17,"tag":36,"props":9924,"children":9925},{"class":38,"line":276},[9926],{"type":17,"tag":36,"props":9927,"children":9928},{"style":80},[9929],{"type":23,"value":9930}," type: Number\n",{"type":17,"tag":36,"props":9932,"children":9933},{"class":38,"line":285},[9934],{"type":17,"tag":36,"props":9935,"children":9936},{"style":80},[9937],{"type":23,"value":3055},{"type":17,"tag":36,"props":9939,"children":9940},{"class":38,"line":815},[9941],{"type":17,"tag":36,"props":9942,"children":9943},{"style":80},[9944],{"type":23,"value":9945}," message: {\n",{"type":17,"tag":36,"props":9947,"children":9948},{"class":38,"line":954},[9949],{"type":17,"tag":36,"props":9950,"children":9951},{"style":80},[9952],{"type":23,"value":9953}," type: String\n",{"type":17,"tag":36,"props":9955,"children":9956},{"class":38,"line":971},[9957],{"type":17,"tag":36,"props":9958,"children":9959},{"style":80},[9960],{"type":23,"value":273},{"type":17,"tag":36,"props":9962,"children":9963},{"class":38,"line":2770},[9964],{"type":17,"tag":36,"props":9965,"children":9966},{"style":80},[9967],{"type":23,"value":1617},{"type":17,"tag":36,"props":9969,"children":9970},{"class":38,"line":2778},[9971],{"type":17,"tag":36,"props":9972,"children":9973},{"emptyLinePlaceholder":617},[9974],{"type":23,"value":620},{"type":17,"tag":36,"props":9976,"children":9977},{"class":38,"line":2794},[9978,9982,9987,9991,9996,10001,10006],{"type":17,"tag":36,"props":9979,"children":9980},{"style":395},[9981],{"type":23,"value":398},{"type":17,"tag":36,"props":9983,"children":9984},{"style":105},[9985],{"type":23,"value":9986}," emit",{"type":17,"tag":36,"props":9988,"children":9989},{"style":395},[9990],{"type":23,"value":408},{"type":17,"tag":36,"props":9992,"children":9993},{"style":411},[9994],{"type":23,"value":9995}," defineEmits",{"type":17,"tag":36,"props":9997,"children":9998},{"style":80},[9999],{"type":23,"value":10000},"([",{"type":17,"tag":36,"props":10002,"children":10003},{"style":422},[10004],{"type":23,"value":10005},"\"sendDate\"",{"type":17,"tag":36,"props":10007,"children":10008},{"style":80},[10009],{"type":23,"value":10010},"])\n",{"type":17,"tag":36,"props":10012,"children":10013},{"class":38,"line":2830},[10014,10018,10022,10026],{"type":17,"tag":36,"props":10015,"children":10016},{"style":411},[10017],{"type":23,"value":8227},{"type":17,"tag":36,"props":10019,"children":10020},{"style":80},[10021],{"type":23,"value":1133},{"type":17,"tag":36,"props":10023,"children":10024},{"style":395},[10025],{"type":23,"value":1138},{"type":17,"tag":36,"props":10027,"children":10028},{"style":80},[10029],{"type":23,"value":94},{"type":17,"tag":36,"props":10031,"children":10032},{"class":38,"line":2863},[10033,10038,10042,10046,10050,10055],{"type":17,"tag":36,"props":10034,"children":10035},{"style":411},[10036],{"type":23,"value":10037}," emit",{"type":17,"tag":36,"props":10039,"children":10040},{"style":80},[10041],{"type":23,"value":419},{"type":17,"tag":36,"props":10043,"children":10044},{"style":422},[10045],{"type":23,"value":10005},{"type":17,"tag":36,"props":10047,"children":10048},{"style":80},[10049],{"type":23,"value":3903},{"type":17,"tag":36,"props":10051,"children":10052},{"style":422},[10053],{"type":23,"value":10054},"\"Emit传来的数据\"",{"type":17,"tag":36,"props":10056,"children":10057},{"style":80},[10058],{"type":23,"value":430},{"type":17,"tag":36,"props":10060,"children":10061},{"class":38,"line":3058},[10062],{"type":17,"tag":36,"props":10063,"children":10064},{"style":80},[10065],{"type":23,"value":1617},{"type":17,"tag":36,"props":10067,"children":10068},{"class":38,"line":3067},[10069,10073,10077],{"type":17,"tag":36,"props":10070,"children":10071},{"style":80},[10072],{"type":23,"value":750},{"type":17,"tag":36,"props":10074,"children":10075},{"style":86},[10076],{"type":23,"value":533},{"type":17,"tag":36,"props":10078,"children":10079},{"style":80},[10080],{"type":23,"value":543},{"type":17,"tag":61,"props":10082,"children":10084},{"id":10083},"vue-router",[10085],{"type":23,"value":10086},"Vue-Router",{"type":17,"tag":304,"props":10088,"children":10090},{"id":10089},"嵌套路由",[10091],{"type":23,"value":10089},{"type":17,"tag":323,"props":10093,"children":10094},{},[10095,10097,10102,10104,10110],{"type":23,"value":10096},"子路由如果前面不加",{"type":17,"tag":32,"props":10098,"children":10100},{"className":10099},[],[10101],{"type":23,"value":2823},{"type":23,"value":10103},"，路由跳转的时候就需要写全路径，如：",{"type":17,"tag":32,"props":10105,"children":10107},{"className":10106},[],[10108],{"type":23,"value":10109},"\u002Fabout\u002Ffoo",{"type":23,"value":10111},"，推荐",{"type":17,"tag":323,"props":10113,"children":10114},{},[10115,10117,10122,10124],{"type":23,"value":10116},"子路由如果前面加",{"type":17,"tag":32,"props":10118,"children":10120},{"className":10119},[],[10121],{"type":23,"value":2823},{"type":23,"value":10123},"，路由跳转的时候就只需要写，如：",{"type":17,"tag":32,"props":10125,"children":10127},{"className":10126},[],[10128],{"type":23,"value":10129},"\u002Ffoo",{"type":17,"tag":304,"props":10131,"children":10133},{"id":10132},"动态路由",[10134],{"type":23,"value":10132},{"type":17,"tag":368,"props":10136,"children":10137},{},[10138],{"type":17,"tag":323,"props":10139,"children":10140},{},[10141],{"type":23,"value":10142},"也就是路由传参",{"type":17,"tag":25,"props":10144,"children":10146},{"className":27,"code":10145,"language":29,"meta":7,"style":7},"children: {\n {\n path: \"bar\u002F:id\"\n }\n}\n",[10147],{"type":17,"tag":32,"props":10148,"children":10149},{"__ignoreMap":7},[10150,10158,10166,10174,10181],{"type":17,"tag":36,"props":10151,"children":10152},{"class":38,"line":39},[10153],{"type":17,"tag":36,"props":10154,"children":10155},{},[10156],{"type":23,"value":10157},"children: {\n",{"type":17,"tag":36,"props":10159,"children":10160},{"class":38,"line":48},[10161],{"type":17,"tag":36,"props":10162,"children":10163},{},[10164],{"type":23,"value":10165}," {\n",{"type":17,"tag":36,"props":10167,"children":10168},{"class":38,"line":115},[10169],{"type":17,"tag":36,"props":10170,"children":10171},{},[10172],{"type":23,"value":10173}," path: \"bar\u002F:id\"\n",{"type":17,"tag":36,"props":10175,"children":10176},{"class":38,"line":133},[10177],{"type":17,"tag":36,"props":10178,"children":10179},{},[10180],{"type":23,"value":273},{"type":17,"tag":36,"props":10182,"children":10183},{"class":38,"line":157},[10184],{"type":17,"tag":36,"props":10185,"children":10186},{},[10187],{"type":23,"value":291},{"type":17,"tag":323,"props":10189,"children":10190},{},[10191],{"type":23,"value":10192},"点击跳转路由时",{"type":17,"tag":25,"props":10194,"children":10196},{"className":27,"code":10195,"language":29,"meta":7,"style":7},"const router = router.push(\"\u002Fanout\u002Fbai\u002F123\")\n",[10197],{"type":17,"tag":32,"props":10198,"children":10199},{"__ignoreMap":7},[10200],{"type":17,"tag":36,"props":10201,"children":10202},{"class":38,"line":39},[10203],{"type":17,"tag":36,"props":10204,"children":10205},{},[10206],{"type":23,"value":10195},{"type":17,"tag":323,"props":10208,"children":10209},{},[10210],{"type":23,"value":10211},"在组件中接收",{"type":17,"tag":25,"props":10213,"children":10215},{"className":27,"code":10214,"language":29,"meta":7,"style":7},"const route = route()\n\nconsole.log(route.params.id)\n",[10216],{"type":17,"tag":32,"props":10217,"children":10218},{"__ignoreMap":7},[10219,10227,10234],{"type":17,"tag":36,"props":10220,"children":10221},{"class":38,"line":39},[10222],{"type":17,"tag":36,"props":10223,"children":10224},{},[10225],{"type":23,"value":10226},"const route = route()\n",{"type":17,"tag":36,"props":10228,"children":10229},{"class":38,"line":48},[10230],{"type":17,"tag":36,"props":10231,"children":10232},{"emptyLinePlaceholder":617},[10233],{"type":23,"value":620},{"type":17,"tag":36,"props":10235,"children":10236},{"class":38,"line":115},[10237],{"type":17,"tag":36,"props":10238,"children":10239},{},[10240],{"type":23,"value":10241},"console.log(route.params.id)\n",{"type":17,"tag":304,"props":10243,"children":10245},{"id":10244},"命名路由",[10246],{"type":23,"value":10244},{"type":17,"tag":323,"props":10248,"children":10249},{},[10250],{"type":23,"value":10251},"可能通过给路由命名，然后通过 name 进行路由跳转",{"type":17,"tag":25,"props":10253,"children":10255},{"className":339,"code":10254,"language":341,"meta":7,"style":7},"\u003Ctemplate>\n \u003Ch2>About\u003C\u002Fh2>\n \u003Cbutton @click=\"toSub1\">Sub1\u003C\u002Fbutton> |\n \u003Cbutton @click=\"toSub2\">Sub2\u003C\u002Fbutton>\n \u003Crouter-view>\u003C\u002Frouter-view>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport { useRouter } from 'vue-router'\nconst router = useRouter()\n\nconst toSub1 = () => {\n router.push({\n name: 'sub1',\n \u002F\u002F 可以携带路由参数\n params: {\n id: 123\n }\n }\n )\n \u002F\u002F router.push(\"\u002Fabout\u002Fsub1\")\n} \n\nconst toSub2 = () => {\n router.push({ name: 'sub2' })\n \u002F\u002F router.push(\"\u002Fabout\u002Fsub2\")\n}\n\u003C\u002Fscript>\n",[10256],{"type":17,"tag":32,"props":10257,"children":10258},{"__ignoreMap":7},[10259,10274,10298,10348,10397,10421,10436,10443,10462,10483,10508,10515,10543,10560,10577,10585,10593,10605,10613,10620,10628,10636,10644,10651,10679,10704,10712,10719],{"type":17,"tag":36,"props":10260,"children":10261},{"class":38,"line":39},[10262,10266,10270],{"type":17,"tag":36,"props":10263,"children":10264},{"style":80},[10265],{"type":23,"value":528},{"type":17,"tag":36,"props":10267,"children":10268},{"style":86},[10269],{"type":23,"value":777},{"type":17,"tag":36,"props":10271,"children":10272},{"style":80},[10273],{"type":23,"value":543},{"type":17,"tag":36,"props":10275,"children":10276},{"class":38,"line":48},[10277,10281,10285,10290,10294],{"type":17,"tag":36,"props":10278,"children":10279},{"style":80},[10280],{"type":23,"value":821},{"type":17,"tag":36,"props":10282,"children":10283},{"style":86},[10284],{"type":23,"value":61},{"type":17,"tag":36,"props":10286,"children":10287},{"style":80},[10288],{"type":23,"value":10289},">About\u003C\u002F",{"type":17,"tag":36,"props":10291,"children":10292},{"style":86},[10293],{"type":23,"value":61},{"type":17,"tag":36,"props":10295,"children":10296},{"style":80},[10297],{"type":23,"value":543},{"type":17,"tag":36,"props":10299,"children":10300},{"class":38,"line":115},[10301,10305,10309,10313,10317,10321,10325,10330,10334,10339,10343],{"type":17,"tag":36,"props":10302,"children":10303},{"style":80},[10304],{"type":23,"value":821},{"type":17,"tag":36,"props":10306,"children":10307},{"style":86},[10308],{"type":23,"value":3739},{"type":17,"tag":36,"props":10310,"children":10311},{"style":80},[10312],{"type":23,"value":916},{"type":17,"tag":36,"props":10314,"children":10315},{"style":411},[10316],{"type":23,"value":921},{"type":17,"tag":36,"props":10318,"children":10319},{"style":80},[10320],{"type":23,"value":482},{"type":17,"tag":36,"props":10322,"children":10323},{"style":422},[10324],{"type":23,"value":842},{"type":17,"tag":36,"props":10326,"children":10327},{"style":80},[10328],{"type":23,"value":10329},"toSub1",{"type":17,"tag":36,"props":10331,"children":10332},{"style":422},[10333],{"type":23,"value":842},{"type":17,"tag":36,"props":10335,"children":10336},{"style":80},[10337],{"type":23,"value":10338},">Sub1\u003C\u002F",{"type":17,"tag":36,"props":10340,"children":10341},{"style":86},[10342],{"type":23,"value":3739},{"type":17,"tag":36,"props":10344,"children":10345},{"style":80},[10346],{"type":23,"value":10347},"> |\n",{"type":17,"tag":36,"props":10349,"children":10350},{"class":38,"line":133},[10351,10355,10359,10363,10367,10371,10375,10380,10384,10389,10393],{"type":17,"tag":36,"props":10352,"children":10353},{"style":80},[10354],{"type":23,"value":821},{"type":17,"tag":36,"props":10356,"children":10357},{"style":86},[10358],{"type":23,"value":3739},{"type":17,"tag":36,"props":10360,"children":10361},{"style":80},[10362],{"type":23,"value":916},{"type":17,"tag":36,"props":10364,"children":10365},{"style":411},[10366],{"type":23,"value":921},{"type":17,"tag":36,"props":10368,"children":10369},{"style":80},[10370],{"type":23,"value":482},{"type":17,"tag":36,"props":10372,"children":10373},{"style":422},[10374],{"type":23,"value":842},{"type":17,"tag":36,"props":10376,"children":10377},{"style":80},[10378],{"type":23,"value":10379},"toSub2",{"type":17,"tag":36,"props":10381,"children":10382},{"style":422},[10383],{"type":23,"value":842},{"type":17,"tag":36,"props":10385,"children":10386},{"style":80},[10387],{"type":23,"value":10388},">Sub2\u003C\u002F",{"type":17,"tag":36,"props":10390,"children":10391},{"style":86},[10392],{"type":23,"value":3739},{"type":17,"tag":36,"props":10394,"children":10395},{"style":80},[10396],{"type":23,"value":543},{"type":17,"tag":36,"props":10398,"children":10399},{"class":38,"line":157},[10400,10404,10409,10413,10417],{"type":17,"tag":36,"props":10401,"children":10402},{"style":80},[10403],{"type":23,"value":821},{"type":17,"tag":36,"props":10405,"children":10406},{"style":86},[10407],{"type":23,"value":10408},"router-view",{"type":17,"tag":36,"props":10410,"children":10411},{"style":80},[10412],{"type":23,"value":1680},{"type":17,"tag":36,"props":10414,"children":10415},{"style":86},[10416],{"type":23,"value":10408},{"type":17,"tag":36,"props":10418,"children":10419},{"style":80},[10420],{"type":23,"value":543},{"type":17,"tag":36,"props":10422,"children":10423},{"class":38,"line":180},[10424,10428,10432],{"type":17,"tag":36,"props":10425,"children":10426},{"style":80},[10427],{"type":23,"value":750},{"type":17,"tag":36,"props":10429,"children":10430},{"style":86},[10431],{"type":23,"value":777},{"type":17,"tag":36,"props":10433,"children":10434},{"style":80},[10435],{"type":23,"value":543},{"type":17,"tag":36,"props":10437,"children":10438},{"class":38,"line":202},[10439],{"type":17,"tag":36,"props":10440,"children":10441},{"emptyLinePlaceholder":617},[10442],{"type":23,"value":620},{"type":17,"tag":36,"props":10444,"children":10445},{"class":38,"line":224},[10446,10450,10454,10458],{"type":17,"tag":36,"props":10447,"children":10448},{"style":80},[10449],{"type":23,"value":528},{"type":17,"tag":36,"props":10451,"children":10452},{"style":86},[10453],{"type":23,"value":533},{"type":17,"tag":36,"props":10455,"children":10456},{"style":411},[10457],{"type":23,"value":538},{"type":17,"tag":36,"props":10459,"children":10460},{"style":80},[10461],{"type":23,"value":543},{"type":17,"tag":36,"props":10463,"children":10464},{"class":38,"line":246},[10465,10469,10474,10478],{"type":17,"tag":36,"props":10466,"children":10467},{"style":395},[10468],{"type":23,"value":1768},{"type":17,"tag":36,"props":10470,"children":10471},{"style":80},[10472],{"type":23,"value":10473}," { useRouter } ",{"type":17,"tag":36,"props":10475,"children":10476},{"style":395},[10477],{"type":23,"value":1047},{"type":17,"tag":36,"props":10479,"children":10480},{"style":422},[10481],{"type":23,"value":10482}," 'vue-router'\n",{"type":17,"tag":36,"props":10484,"children":10485},{"class":38,"line":267},[10486,10490,10495,10499,10504],{"type":17,"tag":36,"props":10487,"children":10488},{"style":395},[10489],{"type":23,"value":398},{"type":17,"tag":36,"props":10491,"children":10492},{"style":105},[10493],{"type":23,"value":10494}," router",{"type":17,"tag":36,"props":10496,"children":10497},{"style":395},[10498],{"type":23,"value":408},{"type":17,"tag":36,"props":10500,"children":10501},{"style":411},[10502],{"type":23,"value":10503}," useRouter",{"type":17,"tag":36,"props":10505,"children":10506},{"style":80},[10507],{"type":23,"value":1160},{"type":17,"tag":36,"props":10509,"children":10510},{"class":38,"line":276},[10511],{"type":17,"tag":36,"props":10512,"children":10513},{"emptyLinePlaceholder":617},[10514],{"type":23,"value":620},{"type":17,"tag":36,"props":10516,"children":10517},{"class":38,"line":285},[10518,10522,10527,10531,10535,10539],{"type":17,"tag":36,"props":10519,"children":10520},{"style":395},[10521],{"type":23,"value":398},{"type":17,"tag":36,"props":10523,"children":10524},{"style":411},[10525],{"type":23,"value":10526}," toSub1",{"type":17,"tag":36,"props":10528,"children":10529},{"style":395},[10530],{"type":23,"value":408},{"type":17,"tag":36,"props":10532,"children":10533},{"style":80},[10534],{"type":23,"value":1363},{"type":17,"tag":36,"props":10536,"children":10537},{"style":395},[10538],{"type":23,"value":1138},{"type":17,"tag":36,"props":10540,"children":10541},{"style":80},[10542],{"type":23,"value":94},{"type":17,"tag":36,"props":10544,"children":10545},{"class":38,"line":815},[10546,10551,10556],{"type":17,"tag":36,"props":10547,"children":10548},{"style":80},[10549],{"type":23,"value":10550}," router.",{"type":17,"tag":36,"props":10552,"children":10553},{"style":411},[10554],{"type":23,"value":10555},"push",{"type":17,"tag":36,"props":10557,"children":10558},{"style":80},[10559],{"type":23,"value":9914},{"type":17,"tag":36,"props":10561,"children":10562},{"class":38,"line":954},[10563,10568,10573],{"type":17,"tag":36,"props":10564,"children":10565},{"style":80},[10566],{"type":23,"value":10567}," name: ",{"type":17,"tag":36,"props":10569,"children":10570},{"style":422},[10571],{"type":23,"value":10572},"'sub1'",{"type":17,"tag":36,"props":10574,"children":10575},{"style":80},[10576],{"type":23,"value":3309},{"type":17,"tag":36,"props":10578,"children":10579},{"class":38,"line":971},[10580],{"type":17,"tag":36,"props":10581,"children":10582},{"style":1805},[10583],{"type":23,"value":10584}," \u002F\u002F 可以携带路由参数\n",{"type":17,"tag":36,"props":10586,"children":10587},{"class":38,"line":2770},[10588],{"type":17,"tag":36,"props":10589,"children":10590},{"style":80},[10591],{"type":23,"value":10592}," params: {\n",{"type":17,"tag":36,"props":10594,"children":10595},{"class":38,"line":2778},[10596,10601],{"type":17,"tag":36,"props":10597,"children":10598},{"style":80},[10599],{"type":23,"value":10600}," id: ",{"type":17,"tag":36,"props":10602,"children":10603},{"style":105},[10604],{"type":23,"value":7047},{"type":17,"tag":36,"props":10606,"children":10607},{"class":38,"line":2794},[10608],{"type":17,"tag":36,"props":10609,"children":10610},{"style":80},[10611],{"type":23,"value":10612}," }\n",{"type":17,"tag":36,"props":10614,"children":10615},{"class":38,"line":2830},[10616],{"type":17,"tag":36,"props":10617,"children":10618},{"style":80},[10619],{"type":23,"value":273},{"type":17,"tag":36,"props":10621,"children":10622},{"class":38,"line":2863},[10623],{"type":17,"tag":36,"props":10624,"children":10625},{"style":80},[10626],{"type":23,"value":10627}," )\n",{"type":17,"tag":36,"props":10629,"children":10630},{"class":38,"line":3058},[10631],{"type":17,"tag":36,"props":10632,"children":10633},{"style":1805},[10634],{"type":23,"value":10635}," \u002F\u002F router.push(\"\u002Fabout\u002Fsub1\")\n",{"type":17,"tag":36,"props":10637,"children":10638},{"class":38,"line":3067},[10639],{"type":17,"tag":36,"props":10640,"children":10641},{"style":80},[10642],{"type":23,"value":10643},"} \n",{"type":17,"tag":36,"props":10645,"children":10646},{"class":38,"line":3085},[10647],{"type":17,"tag":36,"props":10648,"children":10649},{"emptyLinePlaceholder":617},[10650],{"type":23,"value":620},{"type":17,"tag":36,"props":10652,"children":10653},{"class":38,"line":3094},[10654,10658,10663,10667,10671,10675],{"type":17,"tag":36,"props":10655,"children":10656},{"style":395},[10657],{"type":23,"value":398},{"type":17,"tag":36,"props":10659,"children":10660},{"style":411},[10661],{"type":23,"value":10662}," toSub2",{"type":17,"tag":36,"props":10664,"children":10665},{"style":395},[10666],{"type":23,"value":408},{"type":17,"tag":36,"props":10668,"children":10669},{"style":80},[10670],{"type":23,"value":1363},{"type":17,"tag":36,"props":10672,"children":10673},{"style":395},[10674],{"type":23,"value":1138},{"type":17,"tag":36,"props":10676,"children":10677},{"style":80},[10678],{"type":23,"value":94},{"type":17,"tag":36,"props":10680,"children":10681},{"class":38,"line":3103},[10682,10686,10690,10695,10700],{"type":17,"tag":36,"props":10683,"children":10684},{"style":80},[10685],{"type":23,"value":10550},{"type":17,"tag":36,"props":10687,"children":10688},{"style":411},[10689],{"type":23,"value":10555},{"type":17,"tag":36,"props":10691,"children":10692},{"style":80},[10693],{"type":23,"value":10694},"({ name: ",{"type":17,"tag":36,"props":10696,"children":10697},{"style":422},[10698],{"type":23,"value":10699},"'sub2'",{"type":17,"tag":36,"props":10701,"children":10702},{"style":80},[10703],{"type":23,"value":1486},{"type":17,"tag":36,"props":10705,"children":10706},{"class":38,"line":3120},[10707],{"type":17,"tag":36,"props":10708,"children":10709},{"style":1805},[10710],{"type":23,"value":10711}," \u002F\u002F router.push(\"\u002Fabout\u002Fsub2\")\n",{"type":17,"tag":36,"props":10713,"children":10714},{"class":38,"line":3129},[10715],{"type":17,"tag":36,"props":10716,"children":10717},{"style":80},[10718],{"type":23,"value":291},{"type":17,"tag":36,"props":10720,"children":10721},{"class":38,"line":3589},[10722,10726,10730],{"type":17,"tag":36,"props":10723,"children":10724},{"style":80},[10725],{"type":23,"value":750},{"type":17,"tag":36,"props":10727,"children":10728},{"style":86},[10729],{"type":23,"value":533},{"type":17,"tag":36,"props":10731,"children":10732},{"style":80},[10733],{"type":23,"value":543},{"type":17,"tag":304,"props":10735,"children":10737},{"id":10736},"路由传参",[10738],{"type":23,"value":10736},{"type":17,"tag":1695,"props":10740,"children":10741},{},[10742,10761,10772],{"type":17,"tag":1699,"props":10743,"children":10744},{},[10745,10747,10753,10755],{"type":23,"value":10746},"query方式(显示)：",{"type":17,"tag":32,"props":10748,"children":10750},{"className":10749},[],[10751],{"type":23,"value":10752},"route.query",{"type":23,"value":10754}," : ",{"type":17,"tag":32,"props":10756,"children":10758},{"className":10757},[],[10759],{"type":23,"value":10760},"const router = router.push(\"\u002Fanout\u002Fbai\u002F?123\")",{"type":17,"tag":1699,"props":10762,"children":10763},{},[10764,10766],{"type":23,"value":10765},"params方式(显示)：route.params: ",{"type":17,"tag":32,"props":10767,"children":10769},{"className":10768},[],[10770],{"type":23,"value":10771},"const router = router.push(\"\u002Fanout\u002Fbai\u002F123\")",{"type":17,"tag":1699,"props":10773,"children":10774},{},[10775,10777,10783,10785],{"type":23,"value":10776},"params方式(隐式)：route.params：在写路由表的时候不写动态路由，如：",{"type":17,"tag":32,"props":10778,"children":10780},{"className":10779},[],[10781],{"type":23,"value":10782},"path: \"bar\u002F:id\"",{"type":23,"value":10784},"改写成",{"type":17,"tag":32,"props":10786,"children":10788},{"className":10787},[],[10789],{"type":23,"value":10790},"path: \"bar",{"type":17,"tag":304,"props":10792,"children":10794},{"id":10793},"route与router对象",[10795],{"type":23,"value":10793},{"type":17,"tag":323,"props":10797,"children":10798},{},[10799],{"type":23,"value":10800},"route：获取路由信息",{"type":17,"tag":323,"props":10802,"children":10803},{},[10804],{"type":23,"value":10805},"router：调用路由方法",{"type":17,"tag":61,"props":10807,"children":10809},{"id":10808},"路由守卫",[10810],{"type":23,"value":10808},{"type":17,"tag":323,"props":10812,"children":10813},{},[10814],{"type":17,"tag":1637,"props":10815,"children":10816},{},[10817],{"type":23,"value":10818},"路由表中配置",{"type":17,"tag":25,"props":10820,"children":10822},{"className":383,"code":10821,"language":385,"meta":7,"style":7},"router.beforeEach((to, from, next) => {\n if(to.meta.auth){\n \u002F\u002F 如果有权限跳转到想去的页面\n next()\n }else {\n \u002F\u002F 没有权限强制跳转到login页面\n next(\"\u002Flogin\")\n }\n})\n",[10823],{"type":17,"tag":32,"props":10824,"children":10825},{"__ignoreMap":7},[10826,10878,10890,10898,10910,10927,10935,10956,10963],{"type":17,"tag":36,"props":10827,"children":10828},{"class":38,"line":39},[10829,10834,10839,10844,10849,10853,10857,10861,10866,10870,10874],{"type":17,"tag":36,"props":10830,"children":10831},{"style":80},[10832],{"type":23,"value":10833},"router.",{"type":17,"tag":36,"props":10835,"children":10836},{"style":411},[10837],{"type":23,"value":10838},"beforeEach",{"type":17,"tag":36,"props":10840,"children":10841},{"style":80},[10842],{"type":23,"value":10843},"((",{"type":17,"tag":36,"props":10845,"children":10846},{"style":1856},[10847],{"type":23,"value":10848},"to",{"type":17,"tag":36,"props":10850,"children":10851},{"style":80},[10852],{"type":23,"value":3903},{"type":17,"tag":36,"props":10854,"children":10855},{"style":1856},[10856],{"type":23,"value":1047},{"type":17,"tag":36,"props":10858,"children":10859},{"style":80},[10860],{"type":23,"value":3903},{"type":17,"tag":36,"props":10862,"children":10863},{"style":1856},[10864],{"type":23,"value":10865},"next",{"type":17,"tag":36,"props":10867,"children":10868},{"style":80},[10869],{"type":23,"value":3913},{"type":17,"tag":36,"props":10871,"children":10872},{"style":395},[10873],{"type":23,"value":1138},{"type":17,"tag":36,"props":10875,"children":10876},{"style":80},[10877],{"type":23,"value":94},{"type":17,"tag":36,"props":10879,"children":10880},{"class":38,"line":48},[10881,10885],{"type":17,"tag":36,"props":10882,"children":10883},{"style":395},[10884],{"type":23,"value":4330},{"type":17,"tag":36,"props":10886,"children":10887},{"style":80},[10888],{"type":23,"value":10889},"(to.meta.auth){\n",{"type":17,"tag":36,"props":10891,"children":10892},{"class":38,"line":115},[10893],{"type":17,"tag":36,"props":10894,"children":10895},{"style":1805},[10896],{"type":23,"value":10897}," \u002F\u002F 如果有权限跳转到想去的页面\n",{"type":17,"tag":36,"props":10899,"children":10900},{"class":38,"line":133},[10901,10906],{"type":17,"tag":36,"props":10902,"children":10903},{"style":411},[10904],{"type":23,"value":10905}," next",{"type":17,"tag":36,"props":10907,"children":10908},{"style":80},[10909],{"type":23,"value":1160},{"type":17,"tag":36,"props":10911,"children":10912},{"class":38,"line":157},[10913,10918,10923],{"type":17,"tag":36,"props":10914,"children":10915},{"style":80},[10916],{"type":23,"value":10917}," }",{"type":17,"tag":36,"props":10919,"children":10920},{"style":395},[10921],{"type":23,"value":10922},"else",{"type":17,"tag":36,"props":10924,"children":10925},{"style":80},[10926],{"type":23,"value":94},{"type":17,"tag":36,"props":10928,"children":10929},{"class":38,"line":180},[10930],{"type":17,"tag":36,"props":10931,"children":10932},{"style":1805},[10933],{"type":23,"value":10934}," \u002F\u002F 没有权限强制跳转到login页面\n",{"type":17,"tag":36,"props":10936,"children":10937},{"class":38,"line":202},[10938,10943,10947,10952],{"type":17,"tag":36,"props":10939,"children":10940},{"style":411},[10941],{"type":23,"value":10942}," next",{"type":17,"tag":36,"props":10944,"children":10945},{"style":80},[10946],{"type":23,"value":419},{"type":17,"tag":36,"props":10948,"children":10949},{"style":422},[10950],{"type":23,"value":10951},"\"\u002Flogin\"",{"type":17,"tag":36,"props":10953,"children":10954},{"style":80},[10955],{"type":23,"value":430},{"type":17,"tag":36,"props":10957,"children":10958},{"class":38,"line":224},[10959],{"type":17,"tag":36,"props":10960,"children":10961},{"style":80},[10962],{"type":23,"value":273},{"type":17,"tag":36,"props":10964,"children":10965},{"class":38,"line":246},[10966],{"type":17,"tag":36,"props":10967,"children":10968},{"style":80},[10969],{"type":23,"value":1617},{"type":17,"tag":323,"props":10971,"children":10972},{},[10973],{"type":17,"tag":1637,"props":10974,"children":10975},{},[10976],{"type":23,"value":10977},"组件内的守卫",{"type":17,"tag":25,"props":10979,"children":10981},{"className":383,"code":10980,"language":385,"meta":7,"style":7},"router.beforeRouteEach((to, from, next) => {\n if(to.meta.auth){\n \u002F\u002F 如果有权限跳转到想去的页面\n next()\n }else {\n \u002F\u002F 没有权限强制跳转到login页面\n next(\"\u002Flogin\")\n }\n})\n",[10982],{"type":17,"tag":32,"props":10983,"children":10984},{"__ignoreMap":7},[10985,11033,11044,11051,11062,11077,11084,11103,11110],{"type":17,"tag":36,"props":10986,"children":10987},{"class":38,"line":39},[10988,10992,10997,11001,11005,11009,11013,11017,11021,11025,11029],{"type":17,"tag":36,"props":10989,"children":10990},{"style":80},[10991],{"type":23,"value":10833},{"type":17,"tag":36,"props":10993,"children":10994},{"style":411},[10995],{"type":23,"value":10996},"beforeRouteEach",{"type":17,"tag":36,"props":10998,"children":10999},{"style":80},[11000],{"type":23,"value":10843},{"type":17,"tag":36,"props":11002,"children":11003},{"style":1856},[11004],{"type":23,"value":10848},{"type":17,"tag":36,"props":11006,"children":11007},{"style":80},[11008],{"type":23,"value":3903},{"type":17,"tag":36,"props":11010,"children":11011},{"style":1856},[11012],{"type":23,"value":1047},{"type":17,"tag":36,"props":11014,"children":11015},{"style":80},[11016],{"type":23,"value":3903},{"type":17,"tag":36,"props":11018,"children":11019},{"style":1856},[11020],{"type":23,"value":10865},{"type":17,"tag":36,"props":11022,"children":11023},{"style":80},[11024],{"type":23,"value":3913},{"type":17,"tag":36,"props":11026,"children":11027},{"style":395},[11028],{"type":23,"value":1138},{"type":17,"tag":36,"props":11030,"children":11031},{"style":80},[11032],{"type":23,"value":94},{"type":17,"tag":36,"props":11034,"children":11035},{"class":38,"line":48},[11036,11040],{"type":17,"tag":36,"props":11037,"children":11038},{"style":395},[11039],{"type":23,"value":4330},{"type":17,"tag":36,"props":11041,"children":11042},{"style":80},[11043],{"type":23,"value":10889},{"type":17,"tag":36,"props":11045,"children":11046},{"class":38,"line":115},[11047],{"type":17,"tag":36,"props":11048,"children":11049},{"style":1805},[11050],{"type":23,"value":10897},{"type":17,"tag":36,"props":11052,"children":11053},{"class":38,"line":133},[11054,11058],{"type":17,"tag":36,"props":11055,"children":11056},{"style":411},[11057],{"type":23,"value":10905},{"type":17,"tag":36,"props":11059,"children":11060},{"style":80},[11061],{"type":23,"value":1160},{"type":17,"tag":36,"props":11063,"children":11064},{"class":38,"line":157},[11065,11069,11073],{"type":17,"tag":36,"props":11066,"children":11067},{"style":80},[11068],{"type":23,"value":10917},{"type":17,"tag":36,"props":11070,"children":11071},{"style":395},[11072],{"type":23,"value":10922},{"type":17,"tag":36,"props":11074,"children":11075},{"style":80},[11076],{"type":23,"value":94},{"type":17,"tag":36,"props":11078,"children":11079},{"class":38,"line":180},[11080],{"type":17,"tag":36,"props":11081,"children":11082},{"style":1805},[11083],{"type":23,"value":10934},{"type":17,"tag":36,"props":11085,"children":11086},{"class":38,"line":202},[11087,11091,11095,11099],{"type":17,"tag":36,"props":11088,"children":11089},{"style":411},[11090],{"type":23,"value":10942},{"type":17,"tag":36,"props":11092,"children":11093},{"style":80},[11094],{"type":23,"value":419},{"type":17,"tag":36,"props":11096,"children":11097},{"style":422},[11098],{"type":23,"value":10951},{"type":17,"tag":36,"props":11100,"children":11101},{"style":80},[11102],{"type":23,"value":430},{"type":17,"tag":36,"props":11104,"children":11105},{"class":38,"line":224},[11106],{"type":17,"tag":36,"props":11107,"children":11108},{"style":80},[11109],{"type":23,"value":273},{"type":17,"tag":36,"props":11111,"children":11112},{"class":38,"line":246},[11113],{"type":17,"tag":36,"props":11114,"children":11115},{"style":80},[11116],{"type":23,"value":1617},{"type":17,"tag":18,"props":11118,"children":11120},{"id":11119},"typescript",[11121],{"type":23,"value":11122},"TypeScript",{"type":17,"tag":61,"props":11124,"children":11126},{"id":11125},"初体验",[11127],{"type":23,"value":11125},{"type":17,"tag":323,"props":11129,"children":11130},{},[11131,11137,11139,11145],{"type":17,"tag":32,"props":11132,"children":11134},{"className":11133},[],[11135],{"type":23,"value":11136},"npm i typescript -g",{"type":23,"value":11138}," ：",{"type":17,"tag":32,"props":11140,"children":11142},{"className":11141},[],[11143],{"type":23,"value":11144},"tsc xxx.ts -w",{"type":23,"value":11146},"   将ts文件转换成js文件",{"type":17,"tag":323,"props":11148,"children":11149},{},[11150,11156],{"type":17,"tag":32,"props":11151,"children":11153},{"className":11152},[],[11154],{"type":23,"value":11155},"tsc --init",{"type":23,"value":11157},"：生成tsconfig.json",{"type":17,"tag":61,"props":11159,"children":11161},{"id":11160},"ts特有的数据类型",[11162],{"type":23,"value":11163},"TS特有的数据类型",{"type":17,"tag":1695,"props":11165,"children":11166},{},[11167,11172],{"type":17,"tag":1699,"props":11168,"children":11169},{},[11170],{"type":23,"value":11171},"never：用不存在的值",{"type":17,"tag":1699,"props":11173,"children":11174},{},[11175],{"type":23,"value":11176},"any：任意类型",{"type":17,"tag":25,"props":11178,"children":11181},{"className":11179,"code":11180,"language":11119,"meta":7,"style":7},"language-typescript shiki shiki-themes github-dark","let a: any = \"string\"\na = 123\na.map(() => { \u002F\u002F 这句不会报错\n \n})\n",[11182],{"type":17,"tag":32,"props":11183,"children":11184},{"__ignoreMap":7},[11185,11215,11232,11263,11270],{"type":17,"tag":36,"props":11186,"children":11187},{"class":38,"line":39},[11188,11192,11197,11201,11206,11210],{"type":17,"tag":36,"props":11189,"children":11190},{"style":395},[11191],{"type":23,"value":472},{"type":17,"tag":36,"props":11193,"children":11194},{"style":80},[11195],{"type":23,"value":11196}," a",{"type":17,"tag":36,"props":11198,"children":11199},{"style":395},[11200],{"type":23,"value":1869},{"type":17,"tag":36,"props":11202,"children":11203},{"style":105},[11204],{"type":23,"value":11205}," any",{"type":17,"tag":36,"props":11207,"children":11208},{"style":395},[11209],{"type":23,"value":408},{"type":17,"tag":36,"props":11211,"children":11212},{"style":422},[11213],{"type":23,"value":11214}," \"string\"\n",{"type":17,"tag":36,"props":11216,"children":11217},{"class":38,"line":48},[11218,11223,11227],{"type":17,"tag":36,"props":11219,"children":11220},{"style":80},[11221],{"type":23,"value":11222},"a ",{"type":17,"tag":36,"props":11224,"children":11225},{"style":395},[11226],{"type":23,"value":482},{"type":17,"tag":36,"props":11228,"children":11229},{"style":105},[11230],{"type":23,"value":11231}," 123\n",{"type":17,"tag":36,"props":11233,"children":11234},{"class":38,"line":115},[11235,11240,11245,11249,11253,11258],{"type":17,"tag":36,"props":11236,"children":11237},{"style":80},[11238],{"type":23,"value":11239},"a.",{"type":17,"tag":36,"props":11241,"children":11242},{"style":411},[11243],{"type":23,"value":11244},"map",{"type":17,"tag":36,"props":11246,"children":11247},{"style":80},[11248],{"type":23,"value":1133},{"type":17,"tag":36,"props":11250,"children":11251},{"style":395},[11252],{"type":23,"value":1138},{"type":17,"tag":36,"props":11254,"children":11255},{"style":80},[11256],{"type":23,"value":11257}," { ",{"type":17,"tag":36,"props":11259,"children":11260},{"style":1805},[11261],{"type":23,"value":11262},"\u002F\u002F 这句不会报错\n",{"type":17,"tag":36,"props":11264,"children":11265},{"class":38,"line":133},[11266],{"type":17,"tag":36,"props":11267,"children":11268},{"style":80},[11269],{"type":23,"value":1120},{"type":17,"tag":36,"props":11271,"children":11272},{"class":38,"line":157},[11273],{"type":17,"tag":36,"props":11274,"children":11275},{"style":80},[11276],{"type":23,"value":1617},{"type":17,"tag":1695,"props":11278,"children":11279},{"start":115},[11280],{"type":17,"tag":1699,"props":11281,"children":11282},{},[11283],{"type":23,"value":11284},"unknow：any类型对应的安全类型",{"type":17,"tag":25,"props":11286,"children":11288},{"className":11179,"code":11287,"language":11119,"meta":7,"style":7},"let a: unknown = \"string\"\na = 123\na.map(() => { \u002F\u002F这句会报错\n \n})\n",[11289],{"type":17,"tag":32,"props":11290,"children":11291},{"__ignoreMap":7},[11292,11320,11335,11363,11370],{"type":17,"tag":36,"props":11293,"children":11294},{"class":38,"line":39},[11295,11299,11303,11307,11312,11316],{"type":17,"tag":36,"props":11296,"children":11297},{"style":395},[11298],{"type":23,"value":472},{"type":17,"tag":36,"props":11300,"children":11301},{"style":80},[11302],{"type":23,"value":11196},{"type":17,"tag":36,"props":11304,"children":11305},{"style":395},[11306],{"type":23,"value":1869},{"type":17,"tag":36,"props":11308,"children":11309},{"style":105},[11310],{"type":23,"value":11311}," unknown",{"type":17,"tag":36,"props":11313,"children":11314},{"style":395},[11315],{"type":23,"value":408},{"type":17,"tag":36,"props":11317,"children":11318},{"style":422},[11319],{"type":23,"value":11214},{"type":17,"tag":36,"props":11321,"children":11322},{"class":38,"line":48},[11323,11327,11331],{"type":17,"tag":36,"props":11324,"children":11325},{"style":80},[11326],{"type":23,"value":11222},{"type":17,"tag":36,"props":11328,"children":11329},{"style":395},[11330],{"type":23,"value":482},{"type":17,"tag":36,"props":11332,"children":11333},{"style":105},[11334],{"type":23,"value":11231},{"type":17,"tag":36,"props":11336,"children":11337},{"class":38,"line":115},[11338,11342,11346,11350,11354,11358],{"type":17,"tag":36,"props":11339,"children":11340},{"style":80},[11341],{"type":23,"value":11239},{"type":17,"tag":36,"props":11343,"children":11344},{"style":411},[11345],{"type":23,"value":11244},{"type":17,"tag":36,"props":11347,"children":11348},{"style":80},[11349],{"type":23,"value":1133},{"type":17,"tag":36,"props":11351,"children":11352},{"style":395},[11353],{"type":23,"value":1138},{"type":17,"tag":36,"props":11355,"children":11356},{"style":80},[11357],{"type":23,"value":11257},{"type":17,"tag":36,"props":11359,"children":11360},{"style":1805},[11361],{"type":23,"value":11362},"\u002F\u002F这句会报错\n",{"type":17,"tag":36,"props":11364,"children":11365},{"class":38,"line":133},[11366],{"type":17,"tag":36,"props":11367,"children":11368},{"style":80},[11369],{"type":23,"value":1120},{"type":17,"tag":36,"props":11371,"children":11372},{"class":38,"line":157},[11373],{"type":17,"tag":36,"props":11374,"children":11375},{"style":80},[11376],{"type":23,"value":1617},{"type":17,"tag":61,"props":11378,"children":11380},{"id":11379},"断言与非空断言",[11381],{"type":23,"value":11379},{"type":17,"tag":25,"props":11383,"children":11385},{"className":11179,"code":11384,"language":11119,"meta":7,"style":7},"\u002F\u002F 断言\nconst a = undefined\nconsole.log((a as []).length)\n\n\n\u002F\u002F 非空断言 !， 断言a肯定非空\nconst a: number | undefined = undefined\na!.length\n",[11386],{"type":17,"tag":32,"props":11387,"children":11388},{"__ignoreMap":7},[11389,11397,11417,11452,11459,11466,11474,11511],{"type":17,"tag":36,"props":11390,"children":11391},{"class":38,"line":39},[11392],{"type":17,"tag":36,"props":11393,"children":11394},{"style":1805},[11395],{"type":23,"value":11396},"\u002F\u002F 断言\n",{"type":17,"tag":36,"props":11398,"children":11399},{"class":38,"line":48},[11400,11404,11408,11412],{"type":17,"tag":36,"props":11401,"children":11402},{"style":395},[11403],{"type":23,"value":398},{"type":17,"tag":36,"props":11405,"children":11406},{"style":105},[11407],{"type":23,"value":11196},{"type":17,"tag":36,"props":11409,"children":11410},{"style":395},[11411],{"type":23,"value":408},{"type":17,"tag":36,"props":11413,"children":11414},{"style":105},[11415],{"type":23,"value":11416}," undefined\n",{"type":17,"tag":36,"props":11418,"children":11419},{"class":38,"line":115},[11420,11425,11429,11434,11438,11443,11448],{"type":17,"tag":36,"props":11421,"children":11422},{"style":80},[11423],{"type":23,"value":11424},"console.",{"type":17,"tag":36,"props":11426,"children":11427},{"style":411},[11428],{"type":23,"value":3428},{"type":17,"tag":36,"props":11430,"children":11431},{"style":80},[11432],{"type":23,"value":11433},"((a ",{"type":17,"tag":36,"props":11435,"children":11436},{"style":395},[11437],{"type":23,"value":1959},{"type":17,"tag":36,"props":11439,"children":11440},{"style":80},[11441],{"type":23,"value":11442}," []).",{"type":17,"tag":36,"props":11444,"children":11445},{"style":105},[11446],{"type":23,"value":11447},"length",{"type":17,"tag":36,"props":11449,"children":11450},{"style":80},[11451],{"type":23,"value":430},{"type":17,"tag":36,"props":11453,"children":11454},{"class":38,"line":133},[11455],{"type":17,"tag":36,"props":11456,"children":11457},{"emptyLinePlaceholder":617},[11458],{"type":23,"value":620},{"type":17,"tag":36,"props":11460,"children":11461},{"class":38,"line":157},[11462],{"type":17,"tag":36,"props":11463,"children":11464},{"emptyLinePlaceholder":617},[11465],{"type":23,"value":620},{"type":17,"tag":36,"props":11467,"children":11468},{"class":38,"line":180},[11469],{"type":17,"tag":36,"props":11470,"children":11471},{"style":1805},[11472],{"type":23,"value":11473},"\u002F\u002F 非空断言 !， 断言a肯定非空\n",{"type":17,"tag":36,"props":11475,"children":11476},{"class":38,"line":202},[11477,11481,11485,11489,11494,11498,11503,11507],{"type":17,"tag":36,"props":11478,"children":11479},{"style":395},[11480],{"type":23,"value":398},{"type":17,"tag":36,"props":11482,"children":11483},{"style":105},[11484],{"type":23,"value":11196},{"type":17,"tag":36,"props":11486,"children":11487},{"style":395},[11488],{"type":23,"value":1869},{"type":17,"tag":36,"props":11490,"children":11491},{"style":105},[11492],{"type":23,"value":11493}," number",{"type":17,"tag":36,"props":11495,"children":11496},{"style":395},[11497],{"type":23,"value":1093},{"type":17,"tag":36,"props":11499,"children":11500},{"style":105},[11501],{"type":23,"value":11502}," undefined",{"type":17,"tag":36,"props":11504,"children":11505},{"style":395},[11506],{"type":23,"value":408},{"type":17,"tag":36,"props":11508,"children":11509},{"style":105},[11510],{"type":23,"value":11416},{"type":17,"tag":36,"props":11512,"children":11513},{"class":38,"line":224},[11514,11519,11523,11527],{"type":17,"tag":36,"props":11515,"children":11516},{"style":80},[11517],{"type":23,"value":11518},"a",{"type":17,"tag":36,"props":11520,"children":11521},{"style":395},[11522],{"type":23,"value":1977},{"type":17,"tag":36,"props":11524,"children":11525},{"style":80},[11526],{"type":23,"value":1420},{"type":17,"tag":36,"props":11528,"children":11529},{"style":105},[11530],{"type":23,"value":11531},"length\n",{"type":17,"tag":61,"props":11533,"children":11535},{"id":11534},"nullish-coalescing",[11536],{"type":23,"value":11537},"nullish coalescing",{"type":17,"tag":323,"props":11539,"children":11540},{},[11541],{"type":23,"value":11542},"nulllish coalescing只判断 null 与 undefined，",{"type":17,"tag":323,"props":11544,"children":11545},{},[11546,11548],{"type":23,"value":11547},"|| 或，",{"type":17,"tag":309,"props":11549,"children":11551},{"style":11550},"color:rgb(25, 27, 31);",[11552],{"type":23,"value":11553},"通过判断布尔真值。",{"type":17,"tag":25,"props":11555,"children":11557},{"className":68,"code":11556,"language":70,"meta":7,"style":7},"const user = {\n name: \"John\",\n address: {\n city: false\n }\n}\n\n\u002F\u002F user、address、city 每一层为undefined或null，直接返回undefined，\nconst cityName1 = user?.address?.city ?? \"unknown\";\nconst cityName2 = false || '123'\nconsole.log(cityName1); \u002F\u002F false\nconsole.log(cityName2); \u002F\u002F 123\n",[11558],{"type":17,"tag":32,"props":11559,"children":11560},{"__ignoreMap":7},[11561,11569,11590,11598,11606,11613,11620,11627,11635,11658,11666,11674],{"type":17,"tag":36,"props":11562,"children":11563},{"class":38,"line":39},[11564],{"type":17,"tag":36,"props":11565,"children":11566},{"style":80},[11567],{"type":23,"value":11568},"const user = {\n",{"type":17,"tag":36,"props":11570,"children":11571},{"class":38,"line":48},[11572,11577,11581,11586],{"type":17,"tag":36,"props":11573,"children":11574},{"style":105},[11575],{"type":23,"value":11576}," name",{"type":17,"tag":36,"props":11578,"children":11579},{"style":80},[11580],{"type":23,"value":144},{"type":17,"tag":36,"props":11582,"children":11583},{"style":422},[11584],{"type":23,"value":11585},"\"John\"",{"type":17,"tag":36,"props":11587,"children":11588},{"style":80},[11589],{"type":23,"value":3309},{"type":17,"tag":36,"props":11591,"children":11592},{"class":38,"line":115},[11593],{"type":17,"tag":36,"props":11594,"children":11595},{"style":80},[11596],{"type":23,"value":11597}," address: {\n",{"type":17,"tag":36,"props":11599,"children":11600},{"class":38,"line":133},[11601],{"type":17,"tag":36,"props":11602,"children":11603},{"style":80},[11604],{"type":23,"value":11605}," city: false\n",{"type":17,"tag":36,"props":11607,"children":11608},{"class":38,"line":157},[11609],{"type":17,"tag":36,"props":11610,"children":11611},{"style":80},[11612],{"type":23,"value":273},{"type":17,"tag":36,"props":11614,"children":11615},{"class":38,"line":180},[11616],{"type":17,"tag":36,"props":11617,"children":11618},{"style":80},[11619],{"type":23,"value":291},{"type":17,"tag":36,"props":11621,"children":11622},{"class":38,"line":202},[11623],{"type":17,"tag":36,"props":11624,"children":11625},{"emptyLinePlaceholder":617},[11626],{"type":23,"value":620},{"type":17,"tag":36,"props":11628,"children":11629},{"class":38,"line":224},[11630],{"type":17,"tag":36,"props":11631,"children":11632},{"style":80},[11633],{"type":23,"value":11634},"\u002F\u002F user、address、city 每一层为undefined或null，直接返回undefined，\n",{"type":17,"tag":36,"props":11636,"children":11637},{"class":38,"line":246},[11638,11643,11648,11653],{"type":17,"tag":36,"props":11639,"children":11640},{"style":80},[11641],{"type":23,"value":11642},"const cityName1 = user?",{"type":17,"tag":36,"props":11644,"children":11645},{"style":2459},[11646],{"type":23,"value":11647},".address?",{"type":17,"tag":36,"props":11649,"children":11650},{"style":411},[11651],{"type":23,"value":11652},".city",{"type":17,"tag":36,"props":11654,"children":11655},{"style":80},[11656],{"type":23,"value":11657}," ?? \"unknown\";\n",{"type":17,"tag":36,"props":11659,"children":11660},{"class":38,"line":267},[11661],{"type":17,"tag":36,"props":11662,"children":11663},{"style":80},[11664],{"type":23,"value":11665},"const cityName2 = false || '123'\n",{"type":17,"tag":36,"props":11667,"children":11668},{"class":38,"line":276},[11669],{"type":17,"tag":36,"props":11670,"children":11671},{"style":80},[11672],{"type":23,"value":11673},"console.log(cityName1); \u002F\u002F false\n",{"type":17,"tag":36,"props":11675,"children":11676},{"class":38,"line":285},[11677],{"type":17,"tag":36,"props":11678,"children":11679},{"style":80},[11680],{"type":23,"value":11681},"console.log(cityName2); \u002F\u002F 123\n",{"type":17,"tag":61,"props":11683,"children":11685},{"id":11684},"数组与元祖",[11686],{"type":23,"value":11684},{"type":17,"tag":304,"props":11688,"children":11690},{"id":11689},"数组",[11691],{"type":23,"value":11689},{"type":17,"tag":25,"props":11693,"children":11695},{"className":27,"code":11694,"language":29,"meta":7,"style":7},"1. const arr1: (number | string)[] = {123, \"string\"}\n\n2. const arr2: Array\u003Cnumber> = [1, 2, 3 ]\n",[11696],{"type":17,"tag":32,"props":11697,"children":11698},{"__ignoreMap":7},[11699,11707,11714],{"type":17,"tag":36,"props":11700,"children":11701},{"class":38,"line":39},[11702],{"type":17,"tag":36,"props":11703,"children":11704},{},[11705],{"type":23,"value":11706},"1. const arr1: (number | string)[] = {123, \"string\"}\n",{"type":17,"tag":36,"props":11708,"children":11709},{"class":38,"line":48},[11710],{"type":17,"tag":36,"props":11711,"children":11712},{"emptyLinePlaceholder":617},[11713],{"type":23,"value":620},{"type":17,"tag":36,"props":11715,"children":11716},{"class":38,"line":115},[11717],{"type":17,"tag":36,"props":11718,"children":11719},{},[11720],{"type":23,"value":11721},"2. const arr2: Array\u003Cnumber> = [1, 2, 3 ]\n",{"type":17,"tag":304,"props":11723,"children":11725},{"id":11724},"元祖",[11726],{"type":23,"value":11724},{"type":17,"tag":323,"props":11728,"children":11729},{},[11730],{"type":23,"value":11731},"元祖类型允许表示一个已知元素数量类型和类型的数组，各元素的类型不必相同",{"type":17,"tag":25,"props":11733,"children":11735},{"className":27,"code":11734,"language":29,"meta":7,"style":7},"const arr3: [number, string] = [1, \"hello\"]\n\narr3[2] = 2 \u002F\u002F eror\n",[11736],{"type":17,"tag":32,"props":11737,"children":11738},{"__ignoreMap":7},[11739,11747,11754],{"type":17,"tag":36,"props":11740,"children":11741},{"class":38,"line":39},[11742],{"type":17,"tag":36,"props":11743,"children":11744},{},[11745],{"type":23,"value":11746},"const arr3: [number, string] = [1, \"hello\"]\n",{"type":17,"tag":36,"props":11748,"children":11749},{"class":38,"line":48},[11750],{"type":17,"tag":36,"props":11751,"children":11752},{"emptyLinePlaceholder":617},[11753],{"type":23,"value":620},{"type":17,"tag":36,"props":11755,"children":11756},{"class":38,"line":115},[11757],{"type":17,"tag":36,"props":11758,"children":11759},{},[11760],{"type":23,"value":11761},"arr3[2] = 2 \u002F\u002F eror\n",{"type":17,"tag":61,"props":11763,"children":11765},{"id":11764},"索引签名",[11766],{"type":23,"value":11764},{"type":17,"tag":368,"props":11768,"children":11769},{},[11770],{"type":17,"tag":323,"props":11771,"children":11772},{},[11773],{"type":23,"value":11774},"后端传过来的数据不确定是什么，我们定义类型的时候就可以使用索引签名",{"type":17,"tag":304,"props":11776,"children":11778},{"id":11777},"对象索引签名",[11779],{"type":23,"value":11777},{"type":17,"tag":323,"props":11781,"children":11782},{},[11783],{"type":23,"value":11784},"对象索引用string类型",{"type":17,"tag":25,"props":11786,"children":11788},{"className":11179,"code":11787,"language":11119,"meta":7,"style":7},"type A = {\n username: string\n age?: number\n [index: string]: any\n}\n\nconst a: A = {\n username: \"张三\",\n age: 12,\n sex: \"男\",\n other: 1\n}\n",[11789],{"type":17,"tag":32,"props":11790,"children":11791},{"__ignoreMap":7},[11792,11813,11830,11848,11865,11872,11879,11906,11923,11940,11957,11970],{"type":17,"tag":36,"props":11793,"children":11794},{"class":38,"line":39},[11795,11800,11805,11809],{"type":17,"tag":36,"props":11796,"children":11797},{"style":395},[11798],{"type":23,"value":11799},"type",{"type":17,"tag":36,"props":11801,"children":11802},{"style":411},[11803],{"type":23,"value":11804}," A",{"type":17,"tag":36,"props":11806,"children":11807},{"style":395},[11808],{"type":23,"value":408},{"type":17,"tag":36,"props":11810,"children":11811},{"style":80},[11812],{"type":23,"value":94},{"type":17,"tag":36,"props":11814,"children":11815},{"class":38,"line":48},[11816,11821,11825],{"type":17,"tag":36,"props":11817,"children":11818},{"style":1856},[11819],{"type":23,"value":11820}," username",{"type":17,"tag":36,"props":11822,"children":11823},{"style":395},[11824],{"type":23,"value":1869},{"type":17,"tag":36,"props":11826,"children":11827},{"style":105},[11828],{"type":23,"value":11829}," string\n",{"type":17,"tag":36,"props":11831,"children":11832},{"class":38,"line":115},[11833,11838,11843],{"type":17,"tag":36,"props":11834,"children":11835},{"style":1856},[11836],{"type":23,"value":11837}," age",{"type":17,"tag":36,"props":11839,"children":11840},{"style":395},[11841],{"type":23,"value":11842},"?:",{"type":17,"tag":36,"props":11844,"children":11845},{"style":105},[11846],{"type":23,"value":11847}," number\n",{"type":17,"tag":36,"props":11849,"children":11850},{"class":38,"line":133},[11851,11856,11860],{"type":17,"tag":36,"props":11852,"children":11853},{"style":80},[11854],{"type":23,"value":11855}," [index: string]",{"type":17,"tag":36,"props":11857,"children":11858},{"style":395},[11859],{"type":23,"value":1869},{"type":17,"tag":36,"props":11861,"children":11862},{"style":105},[11863],{"type":23,"value":11864}," any\n",{"type":17,"tag":36,"props":11866,"children":11867},{"class":38,"line":157},[11868],{"type":17,"tag":36,"props":11869,"children":11870},{"style":80},[11871],{"type":23,"value":291},{"type":17,"tag":36,"props":11873,"children":11874},{"class":38,"line":180},[11875],{"type":17,"tag":36,"props":11876,"children":11877},{"emptyLinePlaceholder":617},[11878],{"type":23,"value":620},{"type":17,"tag":36,"props":11880,"children":11881},{"class":38,"line":202},[11882,11886,11890,11894,11898,11902],{"type":17,"tag":36,"props":11883,"children":11884},{"style":395},[11885],{"type":23,"value":398},{"type":17,"tag":36,"props":11887,"children":11888},{"style":105},[11889],{"type":23,"value":11196},{"type":17,"tag":36,"props":11891,"children":11892},{"style":395},[11893],{"type":23,"value":1869},{"type":17,"tag":36,"props":11895,"children":11896},{"style":411},[11897],{"type":23,"value":11804},{"type":17,"tag":36,"props":11899,"children":11900},{"style":395},[11901],{"type":23,"value":408},{"type":17,"tag":36,"props":11903,"children":11904},{"style":80},[11905],{"type":23,"value":94},{"type":17,"tag":36,"props":11907,"children":11908},{"class":38,"line":224},[11909,11914,11919],{"type":17,"tag":36,"props":11910,"children":11911},{"style":80},[11912],{"type":23,"value":11913}," username: ",{"type":17,"tag":36,"props":11915,"children":11916},{"style":422},[11917],{"type":23,"value":11918},"\"张三\"",{"type":17,"tag":36,"props":11920,"children":11921},{"style":80},[11922],{"type":23,"value":3309},{"type":17,"tag":36,"props":11924,"children":11925},{"class":38,"line":246},[11926,11931,11936],{"type":17,"tag":36,"props":11927,"children":11928},{"style":80},[11929],{"type":23,"value":11930}," age: ",{"type":17,"tag":36,"props":11932,"children":11933},{"style":105},[11934],{"type":23,"value":11935},"12",{"type":17,"tag":36,"props":11937,"children":11938},{"style":80},[11939],{"type":23,"value":3309},{"type":17,"tag":36,"props":11941,"children":11942},{"class":38,"line":267},[11943,11948,11953],{"type":17,"tag":36,"props":11944,"children":11945},{"style":80},[11946],{"type":23,"value":11947}," sex: ",{"type":17,"tag":36,"props":11949,"children":11950},{"style":422},[11951],{"type":23,"value":11952},"\"男\"",{"type":17,"tag":36,"props":11954,"children":11955},{"style":80},[11956],{"type":23,"value":3309},{"type":17,"tag":36,"props":11958,"children":11959},{"class":38,"line":276},[11960,11965],{"type":17,"tag":36,"props":11961,"children":11962},{"style":80},[11963],{"type":23,"value":11964}," other: ",{"type":17,"tag":36,"props":11966,"children":11967},{"style":105},[11968],{"type":23,"value":11969},"1\n",{"type":17,"tag":36,"props":11971,"children":11972},{"class":38,"line":285},[11973],{"type":17,"tag":36,"props":11974,"children":11975},{"style":80},[11976],{"type":23,"value":291},{"type":17,"tag":304,"props":11978,"children":11980},{"id":11979},"数组索引签名",[11981],{"type":23,"value":11979},{"type":17,"tag":323,"props":11983,"children":11984},{},[11985],{"type":23,"value":11986},"数组索引用number类型",{"type":17,"tag":25,"props":11988,"children":11990},{"className":27,"code":11989,"language":29,"meta":7,"style":7},"type A = {\n [index: number]: any\n}\n\nconst a: A = [1, 2, 3, \"zhangsan\"]\n",[11991],{"type":17,"tag":32,"props":11992,"children":11993},{"__ignoreMap":7},[11994,12002,12010,12017,12024],{"type":17,"tag":36,"props":11995,"children":11996},{"class":38,"line":39},[11997],{"type":17,"tag":36,"props":11998,"children":11999},{},[12000],{"type":23,"value":12001},"type A = {\n",{"type":17,"tag":36,"props":12003,"children":12004},{"class":38,"line":48},[12005],{"type":17,"tag":36,"props":12006,"children":12007},{},[12008],{"type":23,"value":12009}," [index: number]: any\n",{"type":17,"tag":36,"props":12011,"children":12012},{"class":38,"line":115},[12013],{"type":17,"tag":36,"props":12014,"children":12015},{},[12016],{"type":23,"value":291},{"type":17,"tag":36,"props":12018,"children":12019},{"class":38,"line":133},[12020],{"type":17,"tag":36,"props":12021,"children":12022},{"emptyLinePlaceholder":617},[12023],{"type":23,"value":620},{"type":17,"tag":36,"props":12025,"children":12026},{"class":38,"line":157},[12027],{"type":17,"tag":36,"props":12028,"children":12029},{},[12030],{"type":23,"value":12031},"const a: A = [1, 2, 3, \"zhangsan\"]\n",{"type":17,"tag":304,"props":12033,"children":12035},{"id":12034},"小技巧-1",[12036],{"type":23,"value":502},{"type":17,"tag":323,"props":12038,"children":12039},{},[12040],{"type":23,"value":12041},"可以使用断言让对象初始值为空，并且限制对象的类型",{"type":17,"tag":25,"props":12043,"children":12045},{"className":27,"code":12044,"language":29,"meta":7,"style":7},"type A = {\n username: string\n age?: number\n}\n\u002F\u002F const a: A = {} error \nconst a = {} as A\n\na.sex = \"男\" \u002F\u002F error\n",[12046],{"type":17,"tag":32,"props":12047,"children":12048},{"__ignoreMap":7},[12049,12056,12064,12072,12079,12087,12095,12102],{"type":17,"tag":36,"props":12050,"children":12051},{"class":38,"line":39},[12052],{"type":17,"tag":36,"props":12053,"children":12054},{},[12055],{"type":23,"value":12001},{"type":17,"tag":36,"props":12057,"children":12058},{"class":38,"line":48},[12059],{"type":17,"tag":36,"props":12060,"children":12061},{},[12062],{"type":23,"value":12063}," username: string\n",{"type":17,"tag":36,"props":12065,"children":12066},{"class":38,"line":115},[12067],{"type":17,"tag":36,"props":12068,"children":12069},{},[12070],{"type":23,"value":12071}," age?: number\n",{"type":17,"tag":36,"props":12073,"children":12074},{"class":38,"line":133},[12075],{"type":17,"tag":36,"props":12076,"children":12077},{},[12078],{"type":23,"value":291},{"type":17,"tag":36,"props":12080,"children":12081},{"class":38,"line":157},[12082],{"type":17,"tag":36,"props":12083,"children":12084},{},[12085],{"type":23,"value":12086},"\u002F\u002F const a: A = {} error \n",{"type":17,"tag":36,"props":12088,"children":12089},{"class":38,"line":180},[12090],{"type":17,"tag":36,"props":12091,"children":12092},{},[12093],{"type":23,"value":12094},"const a = {} as A\n",{"type":17,"tag":36,"props":12096,"children":12097},{"class":38,"line":202},[12098],{"type":17,"tag":36,"props":12099,"children":12100},{"emptyLinePlaceholder":617},[12101],{"type":23,"value":620},{"type":17,"tag":36,"props":12103,"children":12104},{"class":38,"line":224},[12105],{"type":17,"tag":36,"props":12106,"children":12107},{},[12108],{"type":23,"value":12109},"a.sex = \"男\" \u002F\u002F error\n",{"type":17,"tag":61,"props":12111,"children":12113},{"id":12112},"函数重载与可调用注解",[12114],{"type":23,"value":12112},{"type":17,"tag":304,"props":12116,"children":12118},{"id":12117},"函数重载",[12119],{"type":23,"value":12117},{"type":17,"tag":368,"props":12121,"children":12122},{},[12123],{"type":17,"tag":323,"props":12124,"children":12125},{},[12126],{"type":23,"value":12127},"函数重载是只函数约束传入不用的参数，返回不同类型的数据，而且可以清晰的知道传入不同的参数得到不同的结果",{"type":17,"tag":25,"props":12129,"children":12131},{"className":11179,"code":12130,"language":11119,"meta":7,"style":7},"function foo(n: number, m: string): any\nfunction foo(n: number, m: number): any\nfunction foo(n: string|number, number|string) {\n\n}\n\nfoo(1,2)\nfoo(\"张三\", \"李四\")\nfoo(1, \"张三\") \u002F\u002F error\n",[12132],{"type":17,"tag":32,"props":12133,"children":12134},{"__ignoreMap":7},[12135,12196,12251,12309,12316,12323,12330,12358,12386],{"type":17,"tag":36,"props":12136,"children":12137},{"class":38,"line":39},[12138,12143,12148,12152,12157,12161,12165,12169,12174,12178,12183,12188,12192],{"type":17,"tag":36,"props":12139,"children":12140},{"style":395},[12141],{"type":23,"value":12142},"function",{"type":17,"tag":36,"props":12144,"children":12145},{"style":411},[12146],{"type":23,"value":12147}," foo",{"type":17,"tag":36,"props":12149,"children":12150},{"style":80},[12151],{"type":23,"value":419},{"type":17,"tag":36,"props":12153,"children":12154},{"style":1856},[12155],{"type":23,"value":12156},"n",{"type":17,"tag":36,"props":12158,"children":12159},{"style":395},[12160],{"type":23,"value":1869},{"type":17,"tag":36,"props":12162,"children":12163},{"style":105},[12164],{"type":23,"value":11493},{"type":17,"tag":36,"props":12166,"children":12167},{"style":80},[12168],{"type":23,"value":3903},{"type":17,"tag":36,"props":12170,"children":12171},{"style":1856},[12172],{"type":23,"value":12173},"m",{"type":17,"tag":36,"props":12175,"children":12176},{"style":395},[12177],{"type":23,"value":1869},{"type":17,"tag":36,"props":12179,"children":12180},{"style":105},[12181],{"type":23,"value":12182}," string",{"type":17,"tag":36,"props":12184,"children":12185},{"style":80},[12186],{"type":23,"value":12187},")",{"type":17,"tag":36,"props":12189,"children":12190},{"style":395},[12191],{"type":23,"value":1869},{"type":17,"tag":36,"props":12193,"children":12194},{"style":105},[12195],{"type":23,"value":11864},{"type":17,"tag":36,"props":12197,"children":12198},{"class":38,"line":48},[12199,12203,12207,12211,12215,12219,12223,12227,12231,12235,12239,12243,12247],{"type":17,"tag":36,"props":12200,"children":12201},{"style":395},[12202],{"type":23,"value":12142},{"type":17,"tag":36,"props":12204,"children":12205},{"style":411},[12206],{"type":23,"value":12147},{"type":17,"tag":36,"props":12208,"children":12209},{"style":80},[12210],{"type":23,"value":419},{"type":17,"tag":36,"props":12212,"children":12213},{"style":1856},[12214],{"type":23,"value":12156},{"type":17,"tag":36,"props":12216,"children":12217},{"style":395},[12218],{"type":23,"value":1869},{"type":17,"tag":36,"props":12220,"children":12221},{"style":105},[12222],{"type":23,"value":11493},{"type":17,"tag":36,"props":12224,"children":12225},{"style":80},[12226],{"type":23,"value":3903},{"type":17,"tag":36,"props":12228,"children":12229},{"style":1856},[12230],{"type":23,"value":12173},{"type":17,"tag":36,"props":12232,"children":12233},{"style":395},[12234],{"type":23,"value":1869},{"type":17,"tag":36,"props":12236,"children":12237},{"style":105},[12238],{"type":23,"value":11493},{"type":17,"tag":36,"props":12240,"children":12241},{"style":80},[12242],{"type":23,"value":12187},{"type":17,"tag":36,"props":12244,"children":12245},{"style":395},[12246],{"type":23,"value":1869},{"type":17,"tag":36,"props":12248,"children":12249},{"style":105},[12250],{"type":23,"value":11864},{"type":17,"tag":36,"props":12252,"children":12253},{"class":38,"line":115},[12254,12258,12262,12266,12270,12274,12278,12283,12288,12292,12296,12300,12305],{"type":17,"tag":36,"props":12255,"children":12256},{"style":395},[12257],{"type":23,"value":12142},{"type":17,"tag":36,"props":12259,"children":12260},{"style":411},[12261],{"type":23,"value":12147},{"type":17,"tag":36,"props":12263,"children":12264},{"style":80},[12265],{"type":23,"value":419},{"type":17,"tag":36,"props":12267,"children":12268},{"style":1856},[12269],{"type":23,"value":12156},{"type":17,"tag":36,"props":12271,"children":12272},{"style":395},[12273],{"type":23,"value":1869},{"type":17,"tag":36,"props":12275,"children":12276},{"style":105},[12277],{"type":23,"value":12182},{"type":17,"tag":36,"props":12279,"children":12280},{"style":395},[12281],{"type":23,"value":12282},"|",{"type":17,"tag":36,"props":12284,"children":12285},{"style":105},[12286],{"type":23,"value":12287},"number",{"type":17,"tag":36,"props":12289,"children":12290},{"style":80},[12291],{"type":23,"value":3903},{"type":17,"tag":36,"props":12293,"children":12294},{"style":1856},[12295],{"type":23,"value":12287},{"type":17,"tag":36,"props":12297,"children":12298},{"style":80},[12299],{"type":23,"value":12282},{"type":17,"tag":36,"props":12301,"children":12302},{"style":1856},[12303],{"type":23,"value":12304},"string",{"type":17,"tag":36,"props":12306,"children":12307},{"style":80},[12308],{"type":23,"value":2285},{"type":17,"tag":36,"props":12310,"children":12311},{"class":38,"line":133},[12312],{"type":17,"tag":36,"props":12313,"children":12314},{"emptyLinePlaceholder":617},[12315],{"type":23,"value":620},{"type":17,"tag":36,"props":12317,"children":12318},{"class":38,"line":157},[12319],{"type":17,"tag":36,"props":12320,"children":12321},{"style":80},[12322],{"type":23,"value":291},{"type":17,"tag":36,"props":12324,"children":12325},{"class":38,"line":180},[12326],{"type":17,"tag":36,"props":12327,"children":12328},{"emptyLinePlaceholder":617},[12329],{"type":23,"value":620},{"type":17,"tag":36,"props":12331,"children":12332},{"class":38,"line":202},[12333,12338,12342,12346,12350,12354],{"type":17,"tag":36,"props":12334,"children":12335},{"style":411},[12336],{"type":23,"value":12337},"foo",{"type":17,"tag":36,"props":12339,"children":12340},{"style":80},[12341],{"type":23,"value":419},{"type":17,"tag":36,"props":12343,"children":12344},{"style":105},[12345],{"type":23,"value":1297},{"type":17,"tag":36,"props":12347,"children":12348},{"style":80},[12349],{"type":23,"value":3953},{"type":17,"tag":36,"props":12351,"children":12352},{"style":105},[12353],{"type":23,"value":5219},{"type":17,"tag":36,"props":12355,"children":12356},{"style":80},[12357],{"type":23,"value":430},{"type":17,"tag":36,"props":12359,"children":12360},{"class":38,"line":224},[12361,12365,12369,12373,12377,12382],{"type":17,"tag":36,"props":12362,"children":12363},{"style":411},[12364],{"type":23,"value":12337},{"type":17,"tag":36,"props":12366,"children":12367},{"style":80},[12368],{"type":23,"value":419},{"type":17,"tag":36,"props":12370,"children":12371},{"style":422},[12372],{"type":23,"value":11918},{"type":17,"tag":36,"props":12374,"children":12375},{"style":80},[12376],{"type":23,"value":3903},{"type":17,"tag":36,"props":12378,"children":12379},{"style":422},[12380],{"type":23,"value":12381},"\"李四\"",{"type":17,"tag":36,"props":12383,"children":12384},{"style":80},[12385],{"type":23,"value":430},{"type":17,"tag":36,"props":12387,"children":12388},{"class":38,"line":246},[12389,12393,12397,12401,12405,12409,12414],{"type":17,"tag":36,"props":12390,"children":12391},{"style":411},[12392],{"type":23,"value":12337},{"type":17,"tag":36,"props":12394,"children":12395},{"style":80},[12396],{"type":23,"value":419},{"type":17,"tag":36,"props":12398,"children":12399},{"style":105},[12400],{"type":23,"value":1297},{"type":17,"tag":36,"props":12402,"children":12403},{"style":80},[12404],{"type":23,"value":3903},{"type":17,"tag":36,"props":12406,"children":12407},{"style":422},[12408],{"type":23,"value":11918},{"type":17,"tag":36,"props":12410,"children":12411},{"style":80},[12412],{"type":23,"value":12413},") ",{"type":17,"tag":36,"props":12415,"children":12416},{"style":1805},[12417],{"type":23,"value":12418},"\u002F\u002F error\n",{"type":17,"tag":304,"props":12420,"children":12422},{"id":12421},"可调用注解",[12423],{"type":23,"value":12421},{"type":17,"tag":25,"props":12425,"children":12427},{"className":11179,"code":12426,"language":11119,"meta":7,"style":7},"\u002F\u002F 定义函数类型\ntype A = () => void;\n\n\u002F\u002F 可调用注解定义函数类型，可以针对函数重载进行类型注解\n\ntype A = {\n () => void\n}\n\nconst a: A = () => {}\n",[12428],{"type":17,"tag":32,"props":12429,"children":12430},{"__ignoreMap":7},[12431,12439,12471,12478,12486,12493,12512,12529,12536,12543],{"type":17,"tag":36,"props":12432,"children":12433},{"class":38,"line":39},[12434],{"type":17,"tag":36,"props":12435,"children":12436},{"style":1805},[12437],{"type":23,"value":12438},"\u002F\u002F 定义函数类型\n",{"type":17,"tag":36,"props":12440,"children":12441},{"class":38,"line":48},[12442,12446,12450,12454,12458,12462,12467],{"type":17,"tag":36,"props":12443,"children":12444},{"style":395},[12445],{"type":23,"value":11799},{"type":17,"tag":36,"props":12447,"children":12448},{"style":411},[12449],{"type":23,"value":11804},{"type":17,"tag":36,"props":12451,"children":12452},{"style":395},[12453],{"type":23,"value":408},{"type":17,"tag":36,"props":12455,"children":12456},{"style":80},[12457],{"type":23,"value":1363},{"type":17,"tag":36,"props":12459,"children":12460},{"style":395},[12461],{"type":23,"value":1138},{"type":17,"tag":36,"props":12463,"children":12464},{"style":105},[12465],{"type":23,"value":12466}," void",{"type":17,"tag":36,"props":12468,"children":12469},{"style":80},[12470],{"type":23,"value":177},{"type":17,"tag":36,"props":12472,"children":12473},{"class":38,"line":115},[12474],{"type":17,"tag":36,"props":12475,"children":12476},{"emptyLinePlaceholder":617},[12477],{"type":23,"value":620},{"type":17,"tag":36,"props":12479,"children":12480},{"class":38,"line":133},[12481],{"type":17,"tag":36,"props":12482,"children":12483},{"style":1805},[12484],{"type":23,"value":12485},"\u002F\u002F 可调用注解定义函数类型，可以针对函数重载进行类型注解\n",{"type":17,"tag":36,"props":12487,"children":12488},{"class":38,"line":157},[12489],{"type":17,"tag":36,"props":12490,"children":12491},{"emptyLinePlaceholder":617},[12492],{"type":23,"value":620},{"type":17,"tag":36,"props":12494,"children":12495},{"class":38,"line":180},[12496,12500,12504,12508],{"type":17,"tag":36,"props":12497,"children":12498},{"style":395},[12499],{"type":23,"value":11799},{"type":17,"tag":36,"props":12501,"children":12502},{"style":411},[12503],{"type":23,"value":11804},{"type":17,"tag":36,"props":12505,"children":12506},{"style":395},[12507],{"type":23,"value":408},{"type":17,"tag":36,"props":12509,"children":12510},{"style":80},[12511],{"type":23,"value":94},{"type":17,"tag":36,"props":12513,"children":12514},{"class":38,"line":202},[12515,12520,12524],{"type":17,"tag":36,"props":12516,"children":12517},{"style":80},[12518],{"type":23,"value":12519}," () ",{"type":17,"tag":36,"props":12521,"children":12522},{"style":395},[12523],{"type":23,"value":1138},{"type":17,"tag":36,"props":12525,"children":12526},{"style":105},[12527],{"type":23,"value":12528}," void\n",{"type":17,"tag":36,"props":12530,"children":12531},{"class":38,"line":224},[12532],{"type":17,"tag":36,"props":12533,"children":12534},{"style":80},[12535],{"type":23,"value":291},{"type":17,"tag":36,"props":12537,"children":12538},{"class":38,"line":246},[12539],{"type":17,"tag":36,"props":12540,"children":12541},{"emptyLinePlaceholder":617},[12542],{"type":23,"value":620},{"type":17,"tag":36,"props":12544,"children":12545},{"class":38,"line":267},[12546,12550,12554,12558,12562,12566,12570,12574],{"type":17,"tag":36,"props":12547,"children":12548},{"style":395},[12549],{"type":23,"value":398},{"type":17,"tag":36,"props":12551,"children":12552},{"style":411},[12553],{"type":23,"value":11196},{"type":17,"tag":36,"props":12555,"children":12556},{"style":395},[12557],{"type":23,"value":1869},{"type":17,"tag":36,"props":12559,"children":12560},{"style":411},[12561],{"type":23,"value":11804},{"type":17,"tag":36,"props":12563,"children":12564},{"style":395},[12565],{"type":23,"value":408},{"type":17,"tag":36,"props":12567,"children":12568},{"style":80},[12569],{"type":23,"value":1363},{"type":17,"tag":36,"props":12571,"children":12572},{"style":395},[12573],{"type":23,"value":1138},{"type":17,"tag":36,"props":12575,"children":12576},{"style":80},[12577],{"type":23,"value":3857},{"type":17,"tag":323,"props":12579,"children":12580},{},[12581],{"type":23,"value":12582},"函数重载与调用注解配合使用",{"type":17,"tag":25,"props":12584,"children":12586},{"className":11179,"code":12585,"language":11119,"meta":7,"style":7},"type A = {\n (n: number, m: number): any\n (n: string, m: string): any\n}\n\nfunction foo(n: number, m: number): any\nfunction foo(n: string, m: string): any\nfunction foo(n: number|string, m: number|string) {\n\n}\n\nconst a: A = foo\n===================================================\nfunction foo(n: number, m: number): any \nfunction foo(n: number|string, m: number|string) {\n\n}\n\nconst a: A = foo; \u002F\u002F error\n",[12587],{"type":17,"tag":32,"props":12588,"children":12589},{"__ignoreMap":7},[12590,12609,12657,12704,12711,12718,12773,12828,12891,12898,12905,12912,12940,12948,13008,13071,13078,13085,13092],{"type":17,"tag":36,"props":12591,"children":12592},{"class":38,"line":39},[12593,12597,12601,12605],{"type":17,"tag":36,"props":12594,"children":12595},{"style":395},[12596],{"type":23,"value":11799},{"type":17,"tag":36,"props":12598,"children":12599},{"style":411},[12600],{"type":23,"value":11804},{"type":17,"tag":36,"props":12602,"children":12603},{"style":395},[12604],{"type":23,"value":408},{"type":17,"tag":36,"props":12606,"children":12607},{"style":80},[12608],{"type":23,"value":94},{"type":17,"tag":36,"props":12610,"children":12611},{"class":38,"line":48},[12612,12617,12621,12625,12629,12633,12637,12641,12645,12649,12653],{"type":17,"tag":36,"props":12613,"children":12614},{"style":80},[12615],{"type":23,"value":12616}," (",{"type":17,"tag":36,"props":12618,"children":12619},{"style":1856},[12620],{"type":23,"value":12156},{"type":17,"tag":36,"props":12622,"children":12623},{"style":395},[12624],{"type":23,"value":1869},{"type":17,"tag":36,"props":12626,"children":12627},{"style":105},[12628],{"type":23,"value":11493},{"type":17,"tag":36,"props":12630,"children":12631},{"style":80},[12632],{"type":23,"value":3903},{"type":17,"tag":36,"props":12634,"children":12635},{"style":1856},[12636],{"type":23,"value":12173},{"type":17,"tag":36,"props":12638,"children":12639},{"style":395},[12640],{"type":23,"value":1869},{"type":17,"tag":36,"props":12642,"children":12643},{"style":105},[12644],{"type":23,"value":11493},{"type":17,"tag":36,"props":12646,"children":12647},{"style":80},[12648],{"type":23,"value":12187},{"type":17,"tag":36,"props":12650,"children":12651},{"style":395},[12652],{"type":23,"value":1869},{"type":17,"tag":36,"props":12654,"children":12655},{"style":105},[12656],{"type":23,"value":11864},{"type":17,"tag":36,"props":12658,"children":12659},{"class":38,"line":115},[12660,12664,12668,12672,12676,12680,12684,12688,12692,12696,12700],{"type":17,"tag":36,"props":12661,"children":12662},{"style":80},[12663],{"type":23,"value":12616},{"type":17,"tag":36,"props":12665,"children":12666},{"style":1856},[12667],{"type":23,"value":12156},{"type":17,"tag":36,"props":12669,"children":12670},{"style":395},[12671],{"type":23,"value":1869},{"type":17,"tag":36,"props":12673,"children":12674},{"style":105},[12675],{"type":23,"value":12182},{"type":17,"tag":36,"props":12677,"children":12678},{"style":80},[12679],{"type":23,"value":3903},{"type":17,"tag":36,"props":12681,"children":12682},{"style":1856},[12683],{"type":23,"value":12173},{"type":17,"tag":36,"props":12685,"children":12686},{"style":395},[12687],{"type":23,"value":1869},{"type":17,"tag":36,"props":12689,"children":12690},{"style":105},[12691],{"type":23,"value":12182},{"type":17,"tag":36,"props":12693,"children":12694},{"style":80},[12695],{"type":23,"value":12187},{"type":17,"tag":36,"props":12697,"children":12698},{"style":395},[12699],{"type":23,"value":1869},{"type":17,"tag":36,"props":12701,"children":12702},{"style":105},[12703],{"type":23,"value":11864},{"type":17,"tag":36,"props":12705,"children":12706},{"class":38,"line":133},[12707],{"type":17,"tag":36,"props":12708,"children":12709},{"style":80},[12710],{"type":23,"value":291},{"type":17,"tag":36,"props":12712,"children":12713},{"class":38,"line":157},[12714],{"type":17,"tag":36,"props":12715,"children":12716},{"emptyLinePlaceholder":617},[12717],{"type":23,"value":620},{"type":17,"tag":36,"props":12719,"children":12720},{"class":38,"line":180},[12721,12725,12729,12733,12737,12741,12745,12749,12753,12757,12761,12765,12769],{"type":17,"tag":36,"props":12722,"children":12723},{"style":395},[12724],{"type":23,"value":12142},{"type":17,"tag":36,"props":12726,"children":12727},{"style":411},[12728],{"type":23,"value":12147},{"type":17,"tag":36,"props":12730,"children":12731},{"style":80},[12732],{"type":23,"value":419},{"type":17,"tag":36,"props":12734,"children":12735},{"style":1856},[12736],{"type":23,"value":12156},{"type":17,"tag":36,"props":12738,"children":12739},{"style":395},[12740],{"type":23,"value":1869},{"type":17,"tag":36,"props":12742,"children":12743},{"style":105},[12744],{"type":23,"value":11493},{"type":17,"tag":36,"props":12746,"children":12747},{"style":80},[12748],{"type":23,"value":3903},{"type":17,"tag":36,"props":12750,"children":12751},{"style":1856},[12752],{"type":23,"value":12173},{"type":17,"tag":36,"props":12754,"children":12755},{"style":395},[12756],{"type":23,"value":1869},{"type":17,"tag":36,"props":12758,"children":12759},{"style":105},[12760],{"type":23,"value":11493},{"type":17,"tag":36,"props":12762,"children":12763},{"style":80},[12764],{"type":23,"value":12187},{"type":17,"tag":36,"props":12766,"children":12767},{"style":395},[12768],{"type":23,"value":1869},{"type":17,"tag":36,"props":12770,"children":12771},{"style":105},[12772],{"type":23,"value":11864},{"type":17,"tag":36,"props":12774,"children":12775},{"class":38,"line":202},[12776,12780,12784,12788,12792,12796,12800,12804,12808,12812,12816,12820,12824],{"type":17,"tag":36,"props":12777,"children":12778},{"style":395},[12779],{"type":23,"value":12142},{"type":17,"tag":36,"props":12781,"children":12782},{"style":411},[12783],{"type":23,"value":12147},{"type":17,"tag":36,"props":12785,"children":12786},{"style":80},[12787],{"type":23,"value":419},{"type":17,"tag":36,"props":12789,"children":12790},{"style":1856},[12791],{"type":23,"value":12156},{"type":17,"tag":36,"props":12793,"children":12794},{"style":395},[12795],{"type":23,"value":1869},{"type":17,"tag":36,"props":12797,"children":12798},{"style":105},[12799],{"type":23,"value":12182},{"type":17,"tag":36,"props":12801,"children":12802},{"style":80},[12803],{"type":23,"value":3903},{"type":17,"tag":36,"props":12805,"children":12806},{"style":1856},[12807],{"type":23,"value":12173},{"type":17,"tag":36,"props":12809,"children":12810},{"style":395},[12811],{"type":23,"value":1869},{"type":17,"tag":36,"props":12813,"children":12814},{"style":105},[12815],{"type":23,"value":12182},{"type":17,"tag":36,"props":12817,"children":12818},{"style":80},[12819],{"type":23,"value":12187},{"type":17,"tag":36,"props":12821,"children":12822},{"style":395},[12823],{"type":23,"value":1869},{"type":17,"tag":36,"props":12825,"children":12826},{"style":105},[12827],{"type":23,"value":11864},{"type":17,"tag":36,"props":12829,"children":12830},{"class":38,"line":224},[12831,12835,12839,12843,12847,12851,12855,12859,12863,12867,12871,12875,12879,12883,12887],{"type":17,"tag":36,"props":12832,"children":12833},{"style":395},[12834],{"type":23,"value":12142},{"type":17,"tag":36,"props":12836,"children":12837},{"style":411},[12838],{"type":23,"value":12147},{"type":17,"tag":36,"props":12840,"children":12841},{"style":80},[12842],{"type":23,"value":419},{"type":17,"tag":36,"props":12844,"children":12845},{"style":1856},[12846],{"type":23,"value":12156},{"type":17,"tag":36,"props":12848,"children":12849},{"style":395},[12850],{"type":23,"value":1869},{"type":17,"tag":36,"props":12852,"children":12853},{"style":105},[12854],{"type":23,"value":11493},{"type":17,"tag":36,"props":12856,"children":12857},{"style":395},[12858],{"type":23,"value":12282},{"type":17,"tag":36,"props":12860,"children":12861},{"style":105},[12862],{"type":23,"value":12304},{"type":17,"tag":36,"props":12864,"children":12865},{"style":80},[12866],{"type":23,"value":3903},{"type":17,"tag":36,"props":12868,"children":12869},{"style":1856},[12870],{"type":23,"value":12173},{"type":17,"tag":36,"props":12872,"children":12873},{"style":395},[12874],{"type":23,"value":1869},{"type":17,"tag":36,"props":12876,"children":12877},{"style":105},[12878],{"type":23,"value":11493},{"type":17,"tag":36,"props":12880,"children":12881},{"style":395},[12882],{"type":23,"value":12282},{"type":17,"tag":36,"props":12884,"children":12885},{"style":105},[12886],{"type":23,"value":12304},{"type":17,"tag":36,"props":12888,"children":12889},{"style":80},[12890],{"type":23,"value":2285},{"type":17,"tag":36,"props":12892,"children":12893},{"class":38,"line":246},[12894],{"type":17,"tag":36,"props":12895,"children":12896},{"emptyLinePlaceholder":617},[12897],{"type":23,"value":620},{"type":17,"tag":36,"props":12899,"children":12900},{"class":38,"line":267},[12901],{"type":17,"tag":36,"props":12902,"children":12903},{"style":80},[12904],{"type":23,"value":291},{"type":17,"tag":36,"props":12906,"children":12907},{"class":38,"line":276},[12908],{"type":17,"tag":36,"props":12909,"children":12910},{"emptyLinePlaceholder":617},[12911],{"type":23,"value":620},{"type":17,"tag":36,"props":12913,"children":12914},{"class":38,"line":285},[12915,12919,12923,12927,12931,12935],{"type":17,"tag":36,"props":12916,"children":12917},{"style":395},[12918],{"type":23,"value":398},{"type":17,"tag":36,"props":12920,"children":12921},{"style":105},[12922],{"type":23,"value":11196},{"type":17,"tag":36,"props":12924,"children":12925},{"style":395},[12926],{"type":23,"value":1869},{"type":17,"tag":36,"props":12928,"children":12929},{"style":411},[12930],{"type":23,"value":11804},{"type":17,"tag":36,"props":12932,"children":12933},{"style":395},[12934],{"type":23,"value":408},{"type":17,"tag":36,"props":12936,"children":12937},{"style":80},[12938],{"type":23,"value":12939}," foo\n",{"type":17,"tag":36,"props":12941,"children":12942},{"class":38,"line":815},[12943],{"type":17,"tag":36,"props":12944,"children":12945},{"style":395},[12946],{"type":23,"value":12947},"===================================================\n",{"type":17,"tag":36,"props":12949,"children":12950},{"class":38,"line":954},[12951,12955,12959,12963,12967,12971,12975,12979,12983,12987,12991,12995,12999,13003],{"type":17,"tag":36,"props":12952,"children":12953},{"style":395},[12954],{"type":23,"value":12142},{"type":17,"tag":36,"props":12956,"children":12957},{"style":411},[12958],{"type":23,"value":12147},{"type":17,"tag":36,"props":12960,"children":12961},{"style":80},[12962],{"type":23,"value":419},{"type":17,"tag":36,"props":12964,"children":12965},{"style":1856},[12966],{"type":23,"value":12156},{"type":17,"tag":36,"props":12968,"children":12969},{"style":395},[12970],{"type":23,"value":1869},{"type":17,"tag":36,"props":12972,"children":12973},{"style":105},[12974],{"type":23,"value":11493},{"type":17,"tag":36,"props":12976,"children":12977},{"style":80},[12978],{"type":23,"value":3903},{"type":17,"tag":36,"props":12980,"children":12981},{"style":1856},[12982],{"type":23,"value":12173},{"type":17,"tag":36,"props":12984,"children":12985},{"style":395},[12986],{"type":23,"value":1869},{"type":17,"tag":36,"props":12988,"children":12989},{"style":105},[12990],{"type":23,"value":11493},{"type":17,"tag":36,"props":12992,"children":12993},{"style":80},[12994],{"type":23,"value":12187},{"type":17,"tag":36,"props":12996,"children":12997},{"style":395},[12998],{"type":23,"value":1869},{"type":17,"tag":36,"props":13000,"children":13001},{"style":105},[13002],{"type":23,"value":11205},{"type":17,"tag":36,"props":13004,"children":13005},{"style":80},[13006],{"type":23,"value":13007}," \n",{"type":17,"tag":36,"props":13009,"children":13010},{"class":38,"line":971},[13011,13015,13019,13023,13027,13031,13035,13039,13043,13047,13051,13055,13059,13063,13067],{"type":17,"tag":36,"props":13012,"children":13013},{"style":395},[13014],{"type":23,"value":12142},{"type":17,"tag":36,"props":13016,"children":13017},{"style":411},[13018],{"type":23,"value":12147},{"type":17,"tag":36,"props":13020,"children":13021},{"style":80},[13022],{"type":23,"value":419},{"type":17,"tag":36,"props":13024,"children":13025},{"style":1856},[13026],{"type":23,"value":12156},{"type":17,"tag":36,"props":13028,"children":13029},{"style":395},[13030],{"type":23,"value":1869},{"type":17,"tag":36,"props":13032,"children":13033},{"style":105},[13034],{"type":23,"value":11493},{"type":17,"tag":36,"props":13036,"children":13037},{"style":395},[13038],{"type":23,"value":12282},{"type":17,"tag":36,"props":13040,"children":13041},{"style":105},[13042],{"type":23,"value":12304},{"type":17,"tag":36,"props":13044,"children":13045},{"style":80},[13046],{"type":23,"value":3903},{"type":17,"tag":36,"props":13048,"children":13049},{"style":1856},[13050],{"type":23,"value":12173},{"type":17,"tag":36,"props":13052,"children":13053},{"style":395},[13054],{"type":23,"value":1869},{"type":17,"tag":36,"props":13056,"children":13057},{"style":105},[13058],{"type":23,"value":11493},{"type":17,"tag":36,"props":13060,"children":13061},{"style":395},[13062],{"type":23,"value":12282},{"type":17,"tag":36,"props":13064,"children":13065},{"style":105},[13066],{"type":23,"value":12304},{"type":17,"tag":36,"props":13068,"children":13069},{"style":80},[13070],{"type":23,"value":2285},{"type":17,"tag":36,"props":13072,"children":13073},{"class":38,"line":2770},[13074],{"type":17,"tag":36,"props":13075,"children":13076},{"emptyLinePlaceholder":617},[13077],{"type":23,"value":620},{"type":17,"tag":36,"props":13079,"children":13080},{"class":38,"line":2778},[13081],{"type":17,"tag":36,"props":13082,"children":13083},{"style":80},[13084],{"type":23,"value":291},{"type":17,"tag":36,"props":13086,"children":13087},{"class":38,"line":2794},[13088],{"type":17,"tag":36,"props":13089,"children":13090},{"emptyLinePlaceholder":617},[13091],{"type":23,"value":620},{"type":17,"tag":36,"props":13093,"children":13094},{"class":38,"line":2830},[13095,13099,13103,13107,13111,13115,13120],{"type":17,"tag":36,"props":13096,"children":13097},{"style":395},[13098],{"type":23,"value":398},{"type":17,"tag":36,"props":13100,"children":13101},{"style":105},[13102],{"type":23,"value":11196},{"type":17,"tag":36,"props":13104,"children":13105},{"style":395},[13106],{"type":23,"value":1869},{"type":17,"tag":36,"props":13108,"children":13109},{"style":411},[13110],{"type":23,"value":11804},{"type":17,"tag":36,"props":13112,"children":13113},{"style":395},[13114],{"type":23,"value":408},{"type":17,"tag":36,"props":13116,"children":13117},{"style":80},[13118],{"type":23,"value":13119}," foo; ",{"type":17,"tag":36,"props":13121,"children":13122},{"style":1805},[13123],{"type":23,"value":12418},{"type":17,"tag":61,"props":13125,"children":13127},{"id":13126},"枚举类型与const枚举",[13128],{"type":23,"value":13126},{"type":17,"tag":368,"props":13130,"children":13131},{},[13132],{"type":17,"tag":323,"props":13133,"children":13134},{},[13135],{"type":23,"value":13136},"美剧是组织手机有关联集合的一种方式，是代码更加易于阅读",{"type":17,"tag":323,"props":13138,"children":13139},{},[13140],{"type":23,"value":13141},"**特点：  **",{"type":17,"tag":1695,"props":13143,"children":13144},{},[13145,13150,13155,13160],{"type":17,"tag":1699,"props":13146,"children":13147},{},[13148],{"type":23,"value":13149},"自动累加",{"type":17,"tag":1699,"props":13151,"children":13152},{},[13153],{"type":23,"value":13154},"反向映射",{"type":17,"tag":1699,"props":13156,"children":13157},{},[13158],{"type":23,"value":13159},"类型方式",{"type":17,"tag":1699,"props":13161,"children":13162},{},[13163],{"type":23,"value":13164},"const枚举",{"type":17,"tag":323,"props":13166,"children":13167},{},[13168],{"type":23,"value":13169},"const枚举性能更好",{"type":17,"tag":25,"props":13171,"children":13173},{"className":11179,"code":13172,"language":11119,"meta":7,"style":7},"const enum Roles {\n .....\n}\n",[13174],{"type":17,"tag":32,"props":13175,"children":13176},{"__ignoreMap":7},[13177,13198,13206],{"type":17,"tag":36,"props":13178,"children":13179},{"class":38,"line":39},[13180,13184,13189,13194],{"type":17,"tag":36,"props":13181,"children":13182},{"style":395},[13183],{"type":23,"value":398},{"type":17,"tag":36,"props":13185,"children":13186},{"style":395},[13187],{"type":23,"value":13188}," enum",{"type":17,"tag":36,"props":13190,"children":13191},{"style":411},[13192],{"type":23,"value":13193}," Roles",{"type":17,"tag":36,"props":13195,"children":13196},{"style":80},[13197],{"type":23,"value":94},{"type":17,"tag":36,"props":13199,"children":13200},{"class":38,"line":48},[13201],{"type":17,"tag":36,"props":13202,"children":13203},{"style":80},[13204],{"type":23,"value":13205}," .....\n",{"type":17,"tag":36,"props":13207,"children":13208},{"class":38,"line":115},[13209],{"type":17,"tag":36,"props":13210,"children":13211},{"style":80},[13212],{"type":23,"value":291},{"type":17,"tag":61,"props":13214,"children":13216},{"id":13215},"接口与类型别名的区别",[13217],{"type":23,"value":13215},{"type":17,"tag":368,"props":13219,"children":13220},{},[13221,13226],{"type":17,"tag":323,"props":13222,"children":13223},{},[13224],{"type":23,"value":13225},"接口：多个类型需要合并、类型之间需要继承用接口",{"type":17,"tag":323,"props":13227,"children":13228},{},[13229],{"type":23,"value":13230},"type：定义基本类型、映射类型、条件类型",{"type":17,"tag":1695,"props":13232,"children":13233},{},[13234,13239,13244,13249],{"type":17,"tag":1699,"props":13235,"children":13236},{},[13237],{"type":23,"value":13238},"对象类型",{"type":17,"tag":1699,"props":13240,"children":13241},{},[13242],{"type":23,"value":13243},"接口合并",{"type":17,"tag":1699,"props":13245,"children":13246},{},[13247],{"type":23,"value":13248},"接口继承",{"type":17,"tag":1699,"props":13250,"children":13251},{},[13252],{"type":23,"value":13253},"映射类型",{"type":17,"tag":323,"props":13255,"children":13256},{},[13257],{"type":23,"value":13258},"接口只能用在对象类型，接口具备合并功能，接口具备继承能力",{"type":17,"tag":323,"props":13260,"children":13261},{},[13262],{"type":23,"value":13263},"类型别名具有映射类型的能力",{"type":17,"tag":25,"props":13265,"children":13267},{"className":11179,"code":13266,"language":11119,"meta":7,"style":7},"\u002F\u002F 1. 接口只能定义对象类型\ntype A = string\n\u002F\u002F interface A string error\n\n\n\u002F\u002F 2. 接口可以合并，类型别名不可以\ninterface B {\n username: string\n}\n\ninterface B {\n age: number\n}\n\n\u002F\u002F type C = {\n\u002F\u002F username: string\n\u002F\u002F }\n\u002F\u002F type C = { \u002F\u002F error\n\u002F\u002F age: number\n\u002F\u002F }\n\n\n\u002F\u002F 3. 接口可以继承\ninterface D {\n username: string\n}\ninterface E extends D {\n age: number\n}\n\nconst obj1: E = {\n username: \"张三\",\n age: 12\n}\n\n\u002F\u002F 4. 类型别名的映射类型\ntype F = {\n [P in \"username\" | \"age\"]: string\n}\n\n\u002F\u002F interface G { error\n\u002F\u002F [P in \"username\" | \"age\"]: string\n\u002F\u002F }\n",[13268],{"type":17,"tag":32,"props":13269,"children":13270},{"__ignoreMap":7},[13271,13279,13298,13306,13313,13320,13328,13345,13360,13367,13374,13389,13404,13411,13418,13426,13434,13442,13450,13458,13465,13472,13479,13487,13503,13518,13525,13550,13565,13572,13579,13607,13622,13634,13641,13648,13656,13676,13721,13728,13735,13743,13751],{"type":17,"tag":36,"props":13272,"children":13273},{"class":38,"line":39},[13274],{"type":17,"tag":36,"props":13275,"children":13276},{"style":1805},[13277],{"type":23,"value":13278},"\u002F\u002F 1. 接口只能定义对象类型\n",{"type":17,"tag":36,"props":13280,"children":13281},{"class":38,"line":48},[13282,13286,13290,13294],{"type":17,"tag":36,"props":13283,"children":13284},{"style":395},[13285],{"type":23,"value":11799},{"type":17,"tag":36,"props":13287,"children":13288},{"style":411},[13289],{"type":23,"value":11804},{"type":17,"tag":36,"props":13291,"children":13292},{"style":395},[13293],{"type":23,"value":408},{"type":17,"tag":36,"props":13295,"children":13296},{"style":105},[13297],{"type":23,"value":11829},{"type":17,"tag":36,"props":13299,"children":13300},{"class":38,"line":115},[13301],{"type":17,"tag":36,"props":13302,"children":13303},{"style":1805},[13304],{"type":23,"value":13305},"\u002F\u002F interface A string error\n",{"type":17,"tag":36,"props":13307,"children":13308},{"class":38,"line":133},[13309],{"type":17,"tag":36,"props":13310,"children":13311},{"emptyLinePlaceholder":617},[13312],{"type":23,"value":620},{"type":17,"tag":36,"props":13314,"children":13315},{"class":38,"line":157},[13316],{"type":17,"tag":36,"props":13317,"children":13318},{"emptyLinePlaceholder":617},[13319],{"type":23,"value":620},{"type":17,"tag":36,"props":13321,"children":13322},{"class":38,"line":180},[13323],{"type":17,"tag":36,"props":13324,"children":13325},{"style":1805},[13326],{"type":23,"value":13327},"\u002F\u002F 2. 接口可以合并，类型别名不可以\n",{"type":17,"tag":36,"props":13329,"children":13330},{"class":38,"line":202},[13331,13336,13341],{"type":17,"tag":36,"props":13332,"children":13333},{"style":395},[13334],{"type":23,"value":13335},"interface",{"type":17,"tag":36,"props":13337,"children":13338},{"style":411},[13339],{"type":23,"value":13340}," B",{"type":17,"tag":36,"props":13342,"children":13343},{"style":80},[13344],{"type":23,"value":94},{"type":17,"tag":36,"props":13346,"children":13347},{"class":38,"line":224},[13348,13352,13356],{"type":17,"tag":36,"props":13349,"children":13350},{"style":1856},[13351],{"type":23,"value":11820},{"type":17,"tag":36,"props":13353,"children":13354},{"style":395},[13355],{"type":23,"value":1869},{"type":17,"tag":36,"props":13357,"children":13358},{"style":105},[13359],{"type":23,"value":11829},{"type":17,"tag":36,"props":13361,"children":13362},{"class":38,"line":246},[13363],{"type":17,"tag":36,"props":13364,"children":13365},{"style":80},[13366],{"type":23,"value":291},{"type":17,"tag":36,"props":13368,"children":13369},{"class":38,"line":267},[13370],{"type":17,"tag":36,"props":13371,"children":13372},{"emptyLinePlaceholder":617},[13373],{"type":23,"value":620},{"type":17,"tag":36,"props":13375,"children":13376},{"class":38,"line":276},[13377,13381,13385],{"type":17,"tag":36,"props":13378,"children":13379},{"style":395},[13380],{"type":23,"value":13335},{"type":17,"tag":36,"props":13382,"children":13383},{"style":411},[13384],{"type":23,"value":13340},{"type":17,"tag":36,"props":13386,"children":13387},{"style":80},[13388],{"type":23,"value":94},{"type":17,"tag":36,"props":13390,"children":13391},{"class":38,"line":285},[13392,13396,13400],{"type":17,"tag":36,"props":13393,"children":13394},{"style":1856},[13395],{"type":23,"value":11837},{"type":17,"tag":36,"props":13397,"children":13398},{"style":395},[13399],{"type":23,"value":1869},{"type":17,"tag":36,"props":13401,"children":13402},{"style":105},[13403],{"type":23,"value":11847},{"type":17,"tag":36,"props":13405,"children":13406},{"class":38,"line":815},[13407],{"type":17,"tag":36,"props":13408,"children":13409},{"style":80},[13410],{"type":23,"value":291},{"type":17,"tag":36,"props":13412,"children":13413},{"class":38,"line":954},[13414],{"type":17,"tag":36,"props":13415,"children":13416},{"emptyLinePlaceholder":617},[13417],{"type":23,"value":620},{"type":17,"tag":36,"props":13419,"children":13420},{"class":38,"line":971},[13421],{"type":17,"tag":36,"props":13422,"children":13423},{"style":1805},[13424],{"type":23,"value":13425},"\u002F\u002F type C = {\n",{"type":17,"tag":36,"props":13427,"children":13428},{"class":38,"line":2770},[13429],{"type":17,"tag":36,"props":13430,"children":13431},{"style":1805},[13432],{"type":23,"value":13433},"\u002F\u002F username: string\n",{"type":17,"tag":36,"props":13435,"children":13436},{"class":38,"line":2778},[13437],{"type":17,"tag":36,"props":13438,"children":13439},{"style":1805},[13440],{"type":23,"value":13441},"\u002F\u002F }\n",{"type":17,"tag":36,"props":13443,"children":13444},{"class":38,"line":2794},[13445],{"type":17,"tag":36,"props":13446,"children":13447},{"style":1805},[13448],{"type":23,"value":13449},"\u002F\u002F type C = { \u002F\u002F error\n",{"type":17,"tag":36,"props":13451,"children":13452},{"class":38,"line":2830},[13453],{"type":17,"tag":36,"props":13454,"children":13455},{"style":1805},[13456],{"type":23,"value":13457},"\u002F\u002F age: number\n",{"type":17,"tag":36,"props":13459,"children":13460},{"class":38,"line":2863},[13461],{"type":17,"tag":36,"props":13462,"children":13463},{"style":1805},[13464],{"type":23,"value":13441},{"type":17,"tag":36,"props":13466,"children":13467},{"class":38,"line":3058},[13468],{"type":17,"tag":36,"props":13469,"children":13470},{"emptyLinePlaceholder":617},[13471],{"type":23,"value":620},{"type":17,"tag":36,"props":13473,"children":13474},{"class":38,"line":3067},[13475],{"type":17,"tag":36,"props":13476,"children":13477},{"emptyLinePlaceholder":617},[13478],{"type":23,"value":620},{"type":17,"tag":36,"props":13480,"children":13481},{"class":38,"line":3085},[13482],{"type":17,"tag":36,"props":13483,"children":13484},{"style":1805},[13485],{"type":23,"value":13486},"\u002F\u002F 3. 接口可以继承\n",{"type":17,"tag":36,"props":13488,"children":13489},{"class":38,"line":3094},[13490,13494,13499],{"type":17,"tag":36,"props":13491,"children":13492},{"style":395},[13493],{"type":23,"value":13335},{"type":17,"tag":36,"props":13495,"children":13496},{"style":411},[13497],{"type":23,"value":13498}," D",{"type":17,"tag":36,"props":13500,"children":13501},{"style":80},[13502],{"type":23,"value":94},{"type":17,"tag":36,"props":13504,"children":13505},{"class":38,"line":3103},[13506,13510,13514],{"type":17,"tag":36,"props":13507,"children":13508},{"style":1856},[13509],{"type":23,"value":11820},{"type":17,"tag":36,"props":13511,"children":13512},{"style":395},[13513],{"type":23,"value":1869},{"type":17,"tag":36,"props":13515,"children":13516},{"style":105},[13517],{"type":23,"value":11829},{"type":17,"tag":36,"props":13519,"children":13520},{"class":38,"line":3120},[13521],{"type":17,"tag":36,"props":13522,"children":13523},{"style":80},[13524],{"type":23,"value":291},{"type":17,"tag":36,"props":13526,"children":13527},{"class":38,"line":3129},[13528,13532,13537,13542,13546],{"type":17,"tag":36,"props":13529,"children":13530},{"style":395},[13531],{"type":23,"value":13335},{"type":17,"tag":36,"props":13533,"children":13534},{"style":411},[13535],{"type":23,"value":13536}," E",{"type":17,"tag":36,"props":13538,"children":13539},{"style":395},[13540],{"type":23,"value":13541}," extends",{"type":17,"tag":36,"props":13543,"children":13544},{"style":411},[13545],{"type":23,"value":13498},{"type":17,"tag":36,"props":13547,"children":13548},{"style":80},[13549],{"type":23,"value":94},{"type":17,"tag":36,"props":13551,"children":13552},{"class":38,"line":3589},[13553,13557,13561],{"type":17,"tag":36,"props":13554,"children":13555},{"style":1856},[13556],{"type":23,"value":11837},{"type":17,"tag":36,"props":13558,"children":13559},{"style":395},[13560],{"type":23,"value":1869},{"type":17,"tag":36,"props":13562,"children":13563},{"style":105},[13564],{"type":23,"value":11847},{"type":17,"tag":36,"props":13566,"children":13567},{"class":38,"line":3597},[13568],{"type":17,"tag":36,"props":13569,"children":13570},{"style":80},[13571],{"type":23,"value":291},{"type":17,"tag":36,"props":13573,"children":13574},{"class":38,"line":3613},[13575],{"type":17,"tag":36,"props":13576,"children":13577},{"emptyLinePlaceholder":617},[13578],{"type":23,"value":620},{"type":17,"tag":36,"props":13580,"children":13581},{"class":38,"line":3621},[13582,13586,13591,13595,13599,13603],{"type":17,"tag":36,"props":13583,"children":13584},{"style":395},[13585],{"type":23,"value":398},{"type":17,"tag":36,"props":13587,"children":13588},{"style":105},[13589],{"type":23,"value":13590}," obj1",{"type":17,"tag":36,"props":13592,"children":13593},{"style":395},[13594],{"type":23,"value":1869},{"type":17,"tag":36,"props":13596,"children":13597},{"style":411},[13598],{"type":23,"value":13536},{"type":17,"tag":36,"props":13600,"children":13601},{"style":395},[13602],{"type":23,"value":408},{"type":17,"tag":36,"props":13604,"children":13605},{"style":80},[13606],{"type":23,"value":94},{"type":17,"tag":36,"props":13608,"children":13609},{"class":38,"line":3642},[13610,13614,13618],{"type":17,"tag":36,"props":13611,"children":13612},{"style":80},[13613],{"type":23,"value":11913},{"type":17,"tag":36,"props":13615,"children":13616},{"style":422},[13617],{"type":23,"value":11918},{"type":17,"tag":36,"props":13619,"children":13620},{"style":80},[13621],{"type":23,"value":3309},{"type":17,"tag":36,"props":13623,"children":13624},{"class":38,"line":3650},[13625,13629],{"type":17,"tag":36,"props":13626,"children":13627},{"style":80},[13628],{"type":23,"value":11930},{"type":17,"tag":36,"props":13630,"children":13631},{"style":105},[13632],{"type":23,"value":13633},"12\n",{"type":17,"tag":36,"props":13635,"children":13636},{"class":38,"line":5022},[13637],{"type":17,"tag":36,"props":13638,"children":13639},{"style":80},[13640],{"type":23,"value":291},{"type":17,"tag":36,"props":13642,"children":13643},{"class":38,"line":5030},[13644],{"type":17,"tag":36,"props":13645,"children":13646},{"emptyLinePlaceholder":617},[13647],{"type":23,"value":620},{"type":17,"tag":36,"props":13649,"children":13650},{"class":38,"line":5043},[13651],{"type":17,"tag":36,"props":13652,"children":13653},{"style":1805},[13654],{"type":23,"value":13655},"\u002F\u002F 4. 类型别名的映射类型\n",{"type":17,"tag":36,"props":13657,"children":13658},{"class":38,"line":5064},[13659,13663,13668,13672],{"type":17,"tag":36,"props":13660,"children":13661},{"style":395},[13662],{"type":23,"value":11799},{"type":17,"tag":36,"props":13664,"children":13665},{"style":411},[13666],{"type":23,"value":13667}," F",{"type":17,"tag":36,"props":13669,"children":13670},{"style":395},[13671],{"type":23,"value":408},{"type":17,"tag":36,"props":13673,"children":13674},{"style":80},[13675],{"type":23,"value":94},{"type":17,"tag":36,"props":13677,"children":13678},{"class":38,"line":5098},[13679,13684,13689,13694,13699,13703,13708,13713,13717],{"type":17,"tag":36,"props":13680,"children":13681},{"style":80},[13682],{"type":23,"value":13683}," [",{"type":17,"tag":36,"props":13685,"children":13686},{"style":411},[13687],{"type":23,"value":13688},"P",{"type":17,"tag":36,"props":13690,"children":13691},{"style":395},[13692],{"type":23,"value":13693}," in",{"type":17,"tag":36,"props":13695,"children":13696},{"style":422},[13697],{"type":23,"value":13698}," \"username\"",{"type":17,"tag":36,"props":13700,"children":13701},{"style":395},[13702],{"type":23,"value":1093},{"type":17,"tag":36,"props":13704,"children":13705},{"style":422},[13706],{"type":23,"value":13707}," \"age\"",{"type":17,"tag":36,"props":13709,"children":13710},{"style":80},[13711],{"type":23,"value":13712},"]",{"type":17,"tag":36,"props":13714,"children":13715},{"style":395},[13716],{"type":23,"value":1869},{"type":17,"tag":36,"props":13718,"children":13719},{"style":105},[13720],{"type":23,"value":11829},{"type":17,"tag":36,"props":13722,"children":13723},{"class":38,"line":5106},[13724],{"type":17,"tag":36,"props":13725,"children":13726},{"style":80},[13727],{"type":23,"value":291},{"type":17,"tag":36,"props":13729,"children":13730},{"class":38,"line":5114},[13731],{"type":17,"tag":36,"props":13732,"children":13733},{"emptyLinePlaceholder":617},[13734],{"type":23,"value":620},{"type":17,"tag":36,"props":13736,"children":13737},{"class":38,"line":5127},[13738],{"type":17,"tag":36,"props":13739,"children":13740},{"style":1805},[13741],{"type":23,"value":13742},"\u002F\u002F interface G { error\n",{"type":17,"tag":36,"props":13744,"children":13745},{"class":38,"line":5147},[13746],{"type":17,"tag":36,"props":13747,"children":13748},{"style":1805},[13749],{"type":23,"value":13750},"\u002F\u002F [P in \"username\" | \"age\"]: string\n",{"type":17,"tag":36,"props":13752,"children":13753},{"class":38,"line":5175},[13754],{"type":17,"tag":36,"props":13755,"children":13756},{"style":1805},[13757],{"type":23,"value":13441},{"type":17,"tag":61,"props":13759,"children":13761},{"id":13760},"字面量类型与keyof关键字",[13762],{"type":23,"value":13760},{"type":17,"tag":25,"props":13764,"children":13766},{"className":27,"code":13765,"language":29,"meta":7,"style":7},"interface A {\n username: '张三'\n age: 123\n}\n\n\u002F\u002F 通过keyof取到 接口A的key\nconst a: keyof A = 'username'\n",[13767],{"type":17,"tag":32,"props":13768,"children":13769},{"__ignoreMap":7},[13770,13778,13786,13794,13801,13808,13816],{"type":17,"tag":36,"props":13771,"children":13772},{"class":38,"line":39},[13773],{"type":17,"tag":36,"props":13774,"children":13775},{},[13776],{"type":23,"value":13777},"interface A {\n",{"type":17,"tag":36,"props":13779,"children":13780},{"class":38,"line":48},[13781],{"type":17,"tag":36,"props":13782,"children":13783},{},[13784],{"type":23,"value":13785}," username: '张三'\n",{"type":17,"tag":36,"props":13787,"children":13788},{"class":38,"line":115},[13789],{"type":17,"tag":36,"props":13790,"children":13791},{},[13792],{"type":23,"value":13793}," age: 123\n",{"type":17,"tag":36,"props":13795,"children":13796},{"class":38,"line":133},[13797],{"type":17,"tag":36,"props":13798,"children":13799},{},[13800],{"type":23,"value":291},{"type":17,"tag":36,"props":13802,"children":13803},{"class":38,"line":157},[13804],{"type":17,"tag":36,"props":13805,"children":13806},{"emptyLinePlaceholder":617},[13807],{"type":23,"value":620},{"type":17,"tag":36,"props":13809,"children":13810},{"class":38,"line":180},[13811],{"type":17,"tag":36,"props":13812,"children":13813},{},[13814],{"type":23,"value":13815},"\u002F\u002F 通过keyof取到 接口A的key\n",{"type":17,"tag":36,"props":13817,"children":13818},{"class":38,"line":202},[13819],{"type":17,"tag":36,"props":13820,"children":13821},{},[13822],{"type":23,"value":13823},"const a: keyof A = 'username'\n",{"type":17,"tag":61,"props":13825,"children":13827},{"id":13826},"类型保护与自定义类型",[13828],{"type":23,"value":13826},{"type":17,"tag":304,"props":13830,"children":13832},{"id":13831},"类型保护",[13833],{"type":23,"value":13831},{"type":17,"tag":368,"props":13835,"children":13836},{},[13837],{"type":17,"tag":323,"props":13838,"children":13839},{},[13840],{"type":23,"value":13841},"缩小类型范围",{"type":17,"tag":1695,"props":13843,"children":13844},{},[13845,13850,13855,13860],{"type":17,"tag":1699,"props":13846,"children":13847},{},[13848],{"type":23,"value":13849},"typeof：只能检查a",{"type":17,"tag":1699,"props":13851,"children":13852},{},[13853],{"type":23,"value":13854},"instanceof",{"type":17,"tag":1699,"props":13856,"children":13857},{},[13858],{"type":23,"value":13859},"in",{"type":17,"tag":1699,"props":13861,"children":13862},{},[13863],{"type":23,"value":13864},"字面量类型",{"type":17,"tag":316,"props":13866,"children":13867},{"id":13859},[13868],{"type":23,"value":13859},{"type":17,"tag":25,"props":13870,"children":13872},{"className":11179,"code":13871,"language":11119,"meta":7,"style":7},"function foo(a: { username: string } | { age: number }) {\n if (\"username\" in a) {\n a.username = \"xiaoming\"\n }\n}\n",[13873],{"type":17,"tag":32,"props":13874,"children":13875},{"__ignoreMap":7},[13876,13946,13971,13988,13995],{"type":17,"tag":36,"props":13877,"children":13878},{"class":38,"line":39},[13879,13883,13887,13891,13895,13899,13903,13908,13912,13916,13920,13924,13928,13933,13937,13941],{"type":17,"tag":36,"props":13880,"children":13881},{"style":395},[13882],{"type":23,"value":12142},{"type":17,"tag":36,"props":13884,"children":13885},{"style":411},[13886],{"type":23,"value":12147},{"type":17,"tag":36,"props":13888,"children":13889},{"style":80},[13890],{"type":23,"value":419},{"type":17,"tag":36,"props":13892,"children":13893},{"style":1856},[13894],{"type":23,"value":11518},{"type":17,"tag":36,"props":13896,"children":13897},{"style":395},[13898],{"type":23,"value":1869},{"type":17,"tag":36,"props":13900,"children":13901},{"style":80},[13902],{"type":23,"value":1931},{"type":17,"tag":36,"props":13904,"children":13905},{"style":1856},[13906],{"type":23,"value":13907},"username",{"type":17,"tag":36,"props":13909,"children":13910},{"style":395},[13911],{"type":23,"value":1869},{"type":17,"tag":36,"props":13913,"children":13914},{"style":105},[13915],{"type":23,"value":12182},{"type":17,"tag":36,"props":13917,"children":13918},{"style":80},[13919],{"type":23,"value":1941},{"type":17,"tag":36,"props":13921,"children":13922},{"style":395},[13923],{"type":23,"value":12282},{"type":17,"tag":36,"props":13925,"children":13926},{"style":80},[13927],{"type":23,"value":1931},{"type":17,"tag":36,"props":13929,"children":13930},{"style":1856},[13931],{"type":23,"value":13932},"age",{"type":17,"tag":36,"props":13934,"children":13935},{"style":395},[13936],{"type":23,"value":1869},{"type":17,"tag":36,"props":13938,"children":13939},{"style":105},[13940],{"type":23,"value":11493},{"type":17,"tag":36,"props":13942,"children":13943},{"style":80},[13944],{"type":23,"value":13945}," }) {\n",{"type":17,"tag":36,"props":13947,"children":13948},{"class":38,"line":48},[13949,13953,13957,13962,13966],{"type":17,"tag":36,"props":13950,"children":13951},{"style":395},[13952],{"type":23,"value":4330},{"type":17,"tag":36,"props":13954,"children":13955},{"style":80},[13956],{"type":23,"value":4023},{"type":17,"tag":36,"props":13958,"children":13959},{"style":422},[13960],{"type":23,"value":13961},"\"username\"",{"type":17,"tag":36,"props":13963,"children":13964},{"style":395},[13965],{"type":23,"value":13693},{"type":17,"tag":36,"props":13967,"children":13968},{"style":80},[13969],{"type":23,"value":13970}," a) {\n",{"type":17,"tag":36,"props":13972,"children":13973},{"class":38,"line":115},[13974,13979,13983],{"type":17,"tag":36,"props":13975,"children":13976},{"style":80},[13977],{"type":23,"value":13978}," a.username ",{"type":17,"tag":36,"props":13980,"children":13981},{"style":395},[13982],{"type":23,"value":482},{"type":17,"tag":36,"props":13984,"children":13985},{"style":422},[13986],{"type":23,"value":13987}," \"xiaoming\"\n",{"type":17,"tag":36,"props":13989,"children":13990},{"class":38,"line":133},[13991],{"type":17,"tag":36,"props":13992,"children":13993},{"style":80},[13994],{"type":23,"value":273},{"type":17,"tag":36,"props":13996,"children":13997},{"class":38,"line":157},[13998],{"type":17,"tag":36,"props":13999,"children":14000},{"style":80},[14001],{"type":23,"value":291},{"type":17,"tag":316,"props":14003,"children":14004},{"id":13854},[14005],{"type":23,"value":13854},{"type":17,"tag":25,"props":14007,"children":14009},{"className":11179,"code":14008,"language":11119,"meta":7,"style":7},"\u002F\u002F instanceof\nclass Foo {\n username = \"zhangsan\"\n}\n\nclass Bar {\n age: 12\n}\n\n\u002F\u002F instanceof 左边是不是有右边的实例 或者 右边的原型是否出现在左边的原型链上\nfunction baz(a: Foo | Bar) {\n if (a instanceof Foo) {\n a.username\n }\n}\n",[14010],{"type":17,"tag":32,"props":14011,"children":14012},{"__ignoreMap":7},[14013,14021,14038,14054,14061,14068,14084,14100,14107,14114,14122,14162,14186,14194,14201],{"type":17,"tag":36,"props":14014,"children":14015},{"class":38,"line":39},[14016],{"type":17,"tag":36,"props":14017,"children":14018},{"style":1805},[14019],{"type":23,"value":14020},"\u002F\u002F instanceof\n",{"type":17,"tag":36,"props":14022,"children":14023},{"class":38,"line":48},[14024,14029,14034],{"type":17,"tag":36,"props":14025,"children":14026},{"style":395},[14027],{"type":23,"value":14028},"class",{"type":17,"tag":36,"props":14030,"children":14031},{"style":411},[14032],{"type":23,"value":14033}," Foo",{"type":17,"tag":36,"props":14035,"children":14036},{"style":80},[14037],{"type":23,"value":94},{"type":17,"tag":36,"props":14039,"children":14040},{"class":38,"line":115},[14041,14045,14049],{"type":17,"tag":36,"props":14042,"children":14043},{"style":1856},[14044],{"type":23,"value":11820},{"type":17,"tag":36,"props":14046,"children":14047},{"style":395},[14048],{"type":23,"value":408},{"type":17,"tag":36,"props":14050,"children":14051},{"style":422},[14052],{"type":23,"value":14053}," \"zhangsan\"\n",{"type":17,"tag":36,"props":14055,"children":14056},{"class":38,"line":133},[14057],{"type":17,"tag":36,"props":14058,"children":14059},{"style":80},[14060],{"type":23,"value":291},{"type":17,"tag":36,"props":14062,"children":14063},{"class":38,"line":157},[14064],{"type":17,"tag":36,"props":14065,"children":14066},{"emptyLinePlaceholder":617},[14067],{"type":23,"value":620},{"type":17,"tag":36,"props":14069,"children":14070},{"class":38,"line":180},[14071,14075,14080],{"type":17,"tag":36,"props":14072,"children":14073},{"style":395},[14074],{"type":23,"value":14028},{"type":17,"tag":36,"props":14076,"children":14077},{"style":411},[14078],{"type":23,"value":14079}," Bar",{"type":17,"tag":36,"props":14081,"children":14082},{"style":80},[14083],{"type":23,"value":94},{"type":17,"tag":36,"props":14085,"children":14086},{"class":38,"line":202},[14087,14091,14095],{"type":17,"tag":36,"props":14088,"children":14089},{"style":1856},[14090],{"type":23,"value":11837},{"type":17,"tag":36,"props":14092,"children":14093},{"style":395},[14094],{"type":23,"value":1869},{"type":17,"tag":36,"props":14096,"children":14097},{"style":105},[14098],{"type":23,"value":14099}," 12\n",{"type":17,"tag":36,"props":14101,"children":14102},{"class":38,"line":224},[14103],{"type":17,"tag":36,"props":14104,"children":14105},{"style":80},[14106],{"type":23,"value":291},{"type":17,"tag":36,"props":14108,"children":14109},{"class":38,"line":246},[14110],{"type":17,"tag":36,"props":14111,"children":14112},{"emptyLinePlaceholder":617},[14113],{"type":23,"value":620},{"type":17,"tag":36,"props":14115,"children":14116},{"class":38,"line":267},[14117],{"type":17,"tag":36,"props":14118,"children":14119},{"style":1805},[14120],{"type":23,"value":14121},"\u002F\u002F instanceof 左边是不是有右边的实例 或者 右边的原型是否出现在左边的原型链上\n",{"type":17,"tag":36,"props":14123,"children":14124},{"class":38,"line":276},[14125,14129,14134,14138,14142,14146,14150,14154,14158],{"type":17,"tag":36,"props":14126,"children":14127},{"style":395},[14128],{"type":23,"value":12142},{"type":17,"tag":36,"props":14130,"children":14131},{"style":411},[14132],{"type":23,"value":14133}," baz",{"type":17,"tag":36,"props":14135,"children":14136},{"style":80},[14137],{"type":23,"value":419},{"type":17,"tag":36,"props":14139,"children":14140},{"style":1856},[14141],{"type":23,"value":11518},{"type":17,"tag":36,"props":14143,"children":14144},{"style":395},[14145],{"type":23,"value":1869},{"type":17,"tag":36,"props":14147,"children":14148},{"style":411},[14149],{"type":23,"value":14033},{"type":17,"tag":36,"props":14151,"children":14152},{"style":395},[14153],{"type":23,"value":1093},{"type":17,"tag":36,"props":14155,"children":14156},{"style":411},[14157],{"type":23,"value":14079},{"type":17,"tag":36,"props":14159,"children":14160},{"style":80},[14161],{"type":23,"value":2285},{"type":17,"tag":36,"props":14163,"children":14164},{"class":38,"line":285},[14165,14169,14174,14178,14182],{"type":17,"tag":36,"props":14166,"children":14167},{"style":395},[14168],{"type":23,"value":4330},{"type":17,"tag":36,"props":14170,"children":14171},{"style":80},[14172],{"type":23,"value":14173}," (a ",{"type":17,"tag":36,"props":14175,"children":14176},{"style":395},[14177],{"type":23,"value":13854},{"type":17,"tag":36,"props":14179,"children":14180},{"style":411},[14181],{"type":23,"value":14033},{"type":17,"tag":36,"props":14183,"children":14184},{"style":80},[14185],{"type":23,"value":2285},{"type":17,"tag":36,"props":14187,"children":14188},{"class":38,"line":815},[14189],{"type":17,"tag":36,"props":14190,"children":14191},{"style":80},[14192],{"type":23,"value":14193}," a.username\n",{"type":17,"tag":36,"props":14195,"children":14196},{"class":38,"line":954},[14197],{"type":17,"tag":36,"props":14198,"children":14199},{"style":80},[14200],{"type":23,"value":273},{"type":17,"tag":36,"props":14202,"children":14203},{"class":38,"line":971},[14204],{"type":17,"tag":36,"props":14205,"children":14206},{"style":80},[14207],{"type":23,"value":291},{"type":17,"tag":316,"props":14209,"children":14211},{"id":14210},"自定义类型保护",[14212],{"type":23,"value":14210},{"type":17,"tag":368,"props":14214,"children":14215},{},[14216],{"type":17,"tag":323,"props":14217,"children":14218},{},[14219],{"type":23,"value":14220},"使用is类型为此",{"type":17,"tag":25,"props":14222,"children":14224},{"className":27,"code":14223,"language":29,"meta":7,"style":7},"function isString(): n is string{\n return typeof n === 'string'\n}\n\nfunction foo(n: string|number) {\n if( isString(n) ){\n n.length\n }\n}\n",[14225],{"type":17,"tag":32,"props":14226,"children":14227},{"__ignoreMap":7},[14228,14236,14244,14251,14258,14266,14274,14282,14289],{"type":17,"tag":36,"props":14229,"children":14230},{"class":38,"line":39},[14231],{"type":17,"tag":36,"props":14232,"children":14233},{},[14234],{"type":23,"value":14235},"function isString(): n is string{\n",{"type":17,"tag":36,"props":14237,"children":14238},{"class":38,"line":48},[14239],{"type":17,"tag":36,"props":14240,"children":14241},{},[14242],{"type":23,"value":14243}," return typeof n === 'string'\n",{"type":17,"tag":36,"props":14245,"children":14246},{"class":38,"line":115},[14247],{"type":17,"tag":36,"props":14248,"children":14249},{},[14250],{"type":23,"value":291},{"type":17,"tag":36,"props":14252,"children":14253},{"class":38,"line":133},[14254],{"type":17,"tag":36,"props":14255,"children":14256},{"emptyLinePlaceholder":617},[14257],{"type":23,"value":620},{"type":17,"tag":36,"props":14259,"children":14260},{"class":38,"line":157},[14261],{"type":17,"tag":36,"props":14262,"children":14263},{},[14264],{"type":23,"value":14265},"function foo(n: string|number) {\n",{"type":17,"tag":36,"props":14267,"children":14268},{"class":38,"line":180},[14269],{"type":17,"tag":36,"props":14270,"children":14271},{},[14272],{"type":23,"value":14273}," if( isString(n) ){\n",{"type":17,"tag":36,"props":14275,"children":14276},{"class":38,"line":202},[14277],{"type":17,"tag":36,"props":14278,"children":14279},{},[14280],{"type":23,"value":14281}," n.length\n",{"type":17,"tag":36,"props":14283,"children":14284},{"class":38,"line":224},[14285],{"type":17,"tag":36,"props":14286,"children":14287},{},[14288],{"type":23,"value":273},{"type":17,"tag":36,"props":14290,"children":14291},{"class":38,"line":246},[14292],{"type":17,"tag":36,"props":14293,"children":14294},{},[14295],{"type":23,"value":291},{"type":17,"tag":61,"props":14297,"children":14299},{"id":14298},"泛型与泛型常见操作",[14300],{"type":23,"value":14298},{"type":17,"tag":368,"props":14302,"children":14303},{},[14304],{"type":17,"tag":323,"props":14305,"children":14306},{},[14307],{"type":23,"value":14308},"泛型是指在定义函数、接口或者类时，未指定其参数类型，只有在运行时传入才能确定",{"type":17,"tag":25,"props":14310,"children":14312},{"className":11179,"code":14311,"language":11119,"meta":7,"style":7},"\u002F\u002F 基础类型\ntype A\u003CT = string> = T\nconst a: A = \"zhangsan\"\nconst b: A\u003Cnumber> = 1\n\n\u002F\u002F 数组类型\ntype MyArray\u003CT> = T[]\nconst arr: MyArray\u003Cnumber> = [1, 2, 3]\nconst arr1: number[] = [1, 2, 3]\n",[14313],{"type":17,"tag":32,"props":14314,"children":14315},{"__ignoreMap":7},[14316,14324,14366,14393,14433,14440,14448,14486,14551],{"type":17,"tag":36,"props":14317,"children":14318},{"class":38,"line":39},[14319],{"type":17,"tag":36,"props":14320,"children":14321},{"style":1805},[14322],{"type":23,"value":14323},"\u002F\u002F 基础类型\n",{"type":17,"tag":36,"props":14325,"children":14326},{"class":38,"line":48},[14327,14331,14335,14339,14344,14348,14352,14357,14361],{"type":17,"tag":36,"props":14328,"children":14329},{"style":395},[14330],{"type":23,"value":11799},{"type":17,"tag":36,"props":14332,"children":14333},{"style":411},[14334],{"type":23,"value":11804},{"type":17,"tag":36,"props":14336,"children":14337},{"style":80},[14338],{"type":23,"value":528},{"type":17,"tag":36,"props":14340,"children":14341},{"style":411},[14342],{"type":23,"value":14343},"T",{"type":17,"tag":36,"props":14345,"children":14346},{"style":395},[14347],{"type":23,"value":408},{"type":17,"tag":36,"props":14349,"children":14350},{"style":105},[14351],{"type":23,"value":12182},{"type":17,"tag":36,"props":14353,"children":14354},{"style":80},[14355],{"type":23,"value":14356},"> ",{"type":17,"tag":36,"props":14358,"children":14359},{"style":395},[14360],{"type":23,"value":482},{"type":17,"tag":36,"props":14362,"children":14363},{"style":411},[14364],{"type":23,"value":14365}," T\n",{"type":17,"tag":36,"props":14367,"children":14368},{"class":38,"line":115},[14369,14373,14377,14381,14385,14389],{"type":17,"tag":36,"props":14370,"children":14371},{"style":395},[14372],{"type":23,"value":398},{"type":17,"tag":36,"props":14374,"children":14375},{"style":105},[14376],{"type":23,"value":11196},{"type":17,"tag":36,"props":14378,"children":14379},{"style":395},[14380],{"type":23,"value":1869},{"type":17,"tag":36,"props":14382,"children":14383},{"style":411},[14384],{"type":23,"value":11804},{"type":17,"tag":36,"props":14386,"children":14387},{"style":395},[14388],{"type":23,"value":408},{"type":17,"tag":36,"props":14390,"children":14391},{"style":422},[14392],{"type":23,"value":14053},{"type":17,"tag":36,"props":14394,"children":14395},{"class":38,"line":133},[14396,14400,14405,14409,14413,14417,14421,14425,14429],{"type":17,"tag":36,"props":14397,"children":14398},{"style":395},[14399],{"type":23,"value":398},{"type":17,"tag":36,"props":14401,"children":14402},{"style":105},[14403],{"type":23,"value":14404}," b",{"type":17,"tag":36,"props":14406,"children":14407},{"style":395},[14408],{"type":23,"value":1869},{"type":17,"tag":36,"props":14410,"children":14411},{"style":411},[14412],{"type":23,"value":11804},{"type":17,"tag":36,"props":14414,"children":14415},{"style":80},[14416],{"type":23,"value":528},{"type":17,"tag":36,"props":14418,"children":14419},{"style":105},[14420],{"type":23,"value":12287},{"type":17,"tag":36,"props":14422,"children":14423},{"style":80},[14424],{"type":23,"value":14356},{"type":17,"tag":36,"props":14426,"children":14427},{"style":395},[14428],{"type":23,"value":482},{"type":17,"tag":36,"props":14430,"children":14431},{"style":105},[14432],{"type":23,"value":8726},{"type":17,"tag":36,"props":14434,"children":14435},{"class":38,"line":157},[14436],{"type":17,"tag":36,"props":14437,"children":14438},{"emptyLinePlaceholder":617},[14439],{"type":23,"value":620},{"type":17,"tag":36,"props":14441,"children":14442},{"class":38,"line":180},[14443],{"type":17,"tag":36,"props":14444,"children":14445},{"style":1805},[14446],{"type":23,"value":14447},"\u002F\u002F 数组类型\n",{"type":17,"tag":36,"props":14449,"children":14450},{"class":38,"line":202},[14451,14455,14460,14464,14468,14472,14476,14481],{"type":17,"tag":36,"props":14452,"children":14453},{"style":395},[14454],{"type":23,"value":11799},{"type":17,"tag":36,"props":14456,"children":14457},{"style":411},[14458],{"type":23,"value":14459}," MyArray",{"type":17,"tag":36,"props":14461,"children":14462},{"style":80},[14463],{"type":23,"value":528},{"type":17,"tag":36,"props":14465,"children":14466},{"style":411},[14467],{"type":23,"value":14343},{"type":17,"tag":36,"props":14469,"children":14470},{"style":80},[14471],{"type":23,"value":14356},{"type":17,"tag":36,"props":14473,"children":14474},{"style":395},[14475],{"type":23,"value":482},{"type":17,"tag":36,"props":14477,"children":14478},{"style":411},[14479],{"type":23,"value":14480}," T",{"type":17,"tag":36,"props":14482,"children":14483},{"style":80},[14484],{"type":23,"value":14485},"[]\n",{"type":17,"tag":36,"props":14487,"children":14488},{"class":38,"line":224},[14489,14493,14498,14502,14506,14510,14514,14518,14522,14526,14530,14534,14538,14542,14547],{"type":17,"tag":36,"props":14490,"children":14491},{"style":395},[14492],{"type":23,"value":398},{"type":17,"tag":36,"props":14494,"children":14495},{"style":105},[14496],{"type":23,"value":14497}," arr",{"type":17,"tag":36,"props":14499,"children":14500},{"style":395},[14501],{"type":23,"value":1869},{"type":17,"tag":36,"props":14503,"children":14504},{"style":411},[14505],{"type":23,"value":14459},{"type":17,"tag":36,"props":14507,"children":14508},{"style":80},[14509],{"type":23,"value":528},{"type":17,"tag":36,"props":14511,"children":14512},{"style":105},[14513],{"type":23,"value":12287},{"type":17,"tag":36,"props":14515,"children":14516},{"style":80},[14517],{"type":23,"value":14356},{"type":17,"tag":36,"props":14519,"children":14520},{"style":395},[14521],{"type":23,"value":482},{"type":17,"tag":36,"props":14523,"children":14524},{"style":80},[14525],{"type":23,"value":3943},{"type":17,"tag":36,"props":14527,"children":14528},{"style":105},[14529],{"type":23,"value":1297},{"type":17,"tag":36,"props":14531,"children":14532},{"style":80},[14533],{"type":23,"value":3903},{"type":17,"tag":36,"props":14535,"children":14536},{"style":105},[14537],{"type":23,"value":5219},{"type":17,"tag":36,"props":14539,"children":14540},{"style":80},[14541],{"type":23,"value":3903},{"type":17,"tag":36,"props":14543,"children":14544},{"style":105},[14545],{"type":23,"value":14546},"3",{"type":17,"tag":36,"props":14548,"children":14549},{"style":80},[14550],{"type":23,"value":3963},{"type":17,"tag":36,"props":14552,"children":14553},{"class":38,"line":246},[14554,14558,14563,14567,14571,14576,14580,14584,14588,14592,14596,14600,14604],{"type":17,"tag":36,"props":14555,"children":14556},{"style":395},[14557],{"type":23,"value":398},{"type":17,"tag":36,"props":14559,"children":14560},{"style":105},[14561],{"type":23,"value":14562}," arr1",{"type":17,"tag":36,"props":14564,"children":14565},{"style":395},[14566],{"type":23,"value":1869},{"type":17,"tag":36,"props":14568,"children":14569},{"style":105},[14570],{"type":23,"value":11493},{"type":17,"tag":36,"props":14572,"children":14573},{"style":80},[14574],{"type":23,"value":14575},"[] ",{"type":17,"tag":36,"props":14577,"children":14578},{"style":395},[14579],{"type":23,"value":482},{"type":17,"tag":36,"props":14581,"children":14582},{"style":80},[14583],{"type":23,"value":3943},{"type":17,"tag":36,"props":14585,"children":14586},{"style":105},[14587],{"type":23,"value":1297},{"type":17,"tag":36,"props":14589,"children":14590},{"style":80},[14591],{"type":23,"value":3903},{"type":17,"tag":36,"props":14593,"children":14594},{"style":105},[14595],{"type":23,"value":5219},{"type":17,"tag":36,"props":14597,"children":14598},{"style":80},[14599],{"type":23,"value":3903},{"type":17,"tag":36,"props":14601,"children":14602},{"style":105},[14603],{"type":23,"value":14546},{"type":17,"tag":36,"props":14605,"children":14606},{"style":80},[14607],{"type":23,"value":3963},{"type":17,"tag":323,"props":14609,"children":14610},{},[14611],{"type":17,"tag":1637,"props":14612,"children":14613},{},[14614],{"type":23,"value":14615},"函数与接口结合",{"type":17,"tag":25,"props":14617,"children":14619},{"className":11179,"code":14618,"language":11119,"meta":7,"style":7},"interface A\u003CT> {\n (n: T): void\n default?: T\n}\n\nconst foo: A\u003Cstring> = (n) => { }\n\n\u002F\u002F foo(123) error\n\u002F\u002F foo.default = 123 error\nfoo(\"张三\")\nfoo.default = \"李四\"\n",[14620],{"type":17,"tag":32,"props":14621,"children":14622},{"__ignoreMap":7},[14623,14647,14678,14694,14701,14708,14764,14771,14779,14787,14806],{"type":17,"tag":36,"props":14624,"children":14625},{"class":38,"line":39},[14626,14630,14634,14638,14642],{"type":17,"tag":36,"props":14627,"children":14628},{"style":395},[14629],{"type":23,"value":13335},{"type":17,"tag":36,"props":14631,"children":14632},{"style":411},[14633],{"type":23,"value":11804},{"type":17,"tag":36,"props":14635,"children":14636},{"style":80},[14637],{"type":23,"value":528},{"type":17,"tag":36,"props":14639,"children":14640},{"style":411},[14641],{"type":23,"value":14343},{"type":17,"tag":36,"props":14643,"children":14644},{"style":80},[14645],{"type":23,"value":14646},"> {\n",{"type":17,"tag":36,"props":14648,"children":14649},{"class":38,"line":48},[14650,14654,14658,14662,14666,14670,14674],{"type":17,"tag":36,"props":14651,"children":14652},{"style":80},[14653],{"type":23,"value":12616},{"type":17,"tag":36,"props":14655,"children":14656},{"style":1856},[14657],{"type":23,"value":12156},{"type":17,"tag":36,"props":14659,"children":14660},{"style":395},[14661],{"type":23,"value":1869},{"type":17,"tag":36,"props":14663,"children":14664},{"style":411},[14665],{"type":23,"value":14480},{"type":17,"tag":36,"props":14667,"children":14668},{"style":80},[14669],{"type":23,"value":12187},{"type":17,"tag":36,"props":14671,"children":14672},{"style":395},[14673],{"type":23,"value":1869},{"type":17,"tag":36,"props":14675,"children":14676},{"style":105},[14677],{"type":23,"value":12528},{"type":17,"tag":36,"props":14679,"children":14680},{"class":38,"line":115},[14681,14686,14690],{"type":17,"tag":36,"props":14682,"children":14683},{"style":1856},[14684],{"type":23,"value":14685}," default",{"type":17,"tag":36,"props":14687,"children":14688},{"style":395},[14689],{"type":23,"value":11842},{"type":17,"tag":36,"props":14691,"children":14692},{"style":411},[14693],{"type":23,"value":14365},{"type":17,"tag":36,"props":14695,"children":14696},{"class":38,"line":133},[14697],{"type":17,"tag":36,"props":14698,"children":14699},{"style":80},[14700],{"type":23,"value":291},{"type":17,"tag":36,"props":14702,"children":14703},{"class":38,"line":157},[14704],{"type":17,"tag":36,"props":14705,"children":14706},{"emptyLinePlaceholder":617},[14707],{"type":23,"value":620},{"type":17,"tag":36,"props":14709,"children":14710},{"class":38,"line":180},[14711,14715,14719,14723,14727,14731,14735,14739,14743,14747,14751,14755,14759],{"type":17,"tag":36,"props":14712,"children":14713},{"style":395},[14714],{"type":23,"value":398},{"type":17,"tag":36,"props":14716,"children":14717},{"style":411},[14718],{"type":23,"value":12147},{"type":17,"tag":36,"props":14720,"children":14721},{"style":395},[14722],{"type":23,"value":1869},{"type":17,"tag":36,"props":14724,"children":14725},{"style":411},[14726],{"type":23,"value":11804},{"type":17,"tag":36,"props":14728,"children":14729},{"style":80},[14730],{"type":23,"value":528},{"type":17,"tag":36,"props":14732,"children":14733},{"style":105},[14734],{"type":23,"value":12304},{"type":17,"tag":36,"props":14736,"children":14737},{"style":80},[14738],{"type":23,"value":14356},{"type":17,"tag":36,"props":14740,"children":14741},{"style":395},[14742],{"type":23,"value":482},{"type":17,"tag":36,"props":14744,"children":14745},{"style":80},[14746],{"type":23,"value":4023},{"type":17,"tag":36,"props":14748,"children":14749},{"style":1856},[14750],{"type":23,"value":12156},{"type":17,"tag":36,"props":14752,"children":14753},{"style":80},[14754],{"type":23,"value":3913},{"type":17,"tag":36,"props":14756,"children":14757},{"style":395},[14758],{"type":23,"value":1138},{"type":17,"tag":36,"props":14760,"children":14761},{"style":80},[14762],{"type":23,"value":14763}," { }\n",{"type":17,"tag":36,"props":14765,"children":14766},{"class":38,"line":202},[14767],{"type":17,"tag":36,"props":14768,"children":14769},{"emptyLinePlaceholder":617},[14770],{"type":23,"value":620},{"type":17,"tag":36,"props":14772,"children":14773},{"class":38,"line":224},[14774],{"type":17,"tag":36,"props":14775,"children":14776},{"style":1805},[14777],{"type":23,"value":14778},"\u002F\u002F foo(123) error\n",{"type":17,"tag":36,"props":14780,"children":14781},{"class":38,"line":246},[14782],{"type":17,"tag":36,"props":14783,"children":14784},{"style":1805},[14785],{"type":23,"value":14786},"\u002F\u002F foo.default = 123 error\n",{"type":17,"tag":36,"props":14788,"children":14789},{"class":38,"line":267},[14790,14794,14798,14802],{"type":17,"tag":36,"props":14791,"children":14792},{"style":411},[14793],{"type":23,"value":12337},{"type":17,"tag":36,"props":14795,"children":14796},{"style":80},[14797],{"type":23,"value":419},{"type":17,"tag":36,"props":14799,"children":14800},{"style":422},[14801],{"type":23,"value":11918},{"type":17,"tag":36,"props":14803,"children":14804},{"style":80},[14805],{"type":23,"value":430},{"type":17,"tag":36,"props":14807,"children":14808},{"class":38,"line":276},[14809,14814,14818],{"type":17,"tag":36,"props":14810,"children":14811},{"style":80},[14812],{"type":23,"value":14813},"foo.default ",{"type":17,"tag":36,"props":14815,"children":14816},{"style":395},[14817],{"type":23,"value":482},{"type":17,"tag":36,"props":14819,"children":14820},{"style":422},[14821],{"type":23,"value":14822}," \"李四\"\n",{"type":17,"tag":304,"props":14824,"children":14826},{"id":14825},"泛型约束",[14827],{"type":23,"value":14825},{"type":17,"tag":323,"props":14829,"children":14830},{},[14831],{"type":17,"tag":1637,"props":14832,"children":14833},{},[14834],{"type":23,"value":14835},"只能是字符串类型",{"type":17,"tag":25,"props":14837,"children":14839},{"className":11179,"code":14838,"language":11119,"meta":7,"style":7},"\u002F\u002F 泛型约束\ntype FunType = string\nfunction bar\u003CT extends FunType>(n: T) { }\n\n\u002F\u002F bar(123) error\nbar(\"张三\")\n",[14840],{"type":17,"tag":32,"props":14841,"children":14842},{"__ignoreMap":7},[14843,14851,14871,14920,14927,14935],{"type":17,"tag":36,"props":14844,"children":14845},{"class":38,"line":39},[14846],{"type":17,"tag":36,"props":14847,"children":14848},{"style":1805},[14849],{"type":23,"value":14850},"\u002F\u002F 泛型约束\n",{"type":17,"tag":36,"props":14852,"children":14853},{"class":38,"line":48},[14854,14858,14863,14867],{"type":17,"tag":36,"props":14855,"children":14856},{"style":395},[14857],{"type":23,"value":11799},{"type":17,"tag":36,"props":14859,"children":14860},{"style":411},[14861],{"type":23,"value":14862}," FunType",{"type":17,"tag":36,"props":14864,"children":14865},{"style":395},[14866],{"type":23,"value":408},{"type":17,"tag":36,"props":14868,"children":14869},{"style":105},[14870],{"type":23,"value":11829},{"type":17,"tag":36,"props":14872,"children":14873},{"class":38,"line":115},[14874,14878,14883,14887,14891,14895,14899,14903,14907,14911,14915],{"type":17,"tag":36,"props":14875,"children":14876},{"style":395},[14877],{"type":23,"value":12142},{"type":17,"tag":36,"props":14879,"children":14880},{"style":411},[14881],{"type":23,"value":14882}," bar",{"type":17,"tag":36,"props":14884,"children":14885},{"style":80},[14886],{"type":23,"value":528},{"type":17,"tag":36,"props":14888,"children":14889},{"style":411},[14890],{"type":23,"value":14343},{"type":17,"tag":36,"props":14892,"children":14893},{"style":395},[14894],{"type":23,"value":13541},{"type":17,"tag":36,"props":14896,"children":14897},{"style":411},[14898],{"type":23,"value":14862},{"type":17,"tag":36,"props":14900,"children":14901},{"style":80},[14902],{"type":23,"value":1103},{"type":17,"tag":36,"props":14904,"children":14905},{"style":1856},[14906],{"type":23,"value":12156},{"type":17,"tag":36,"props":14908,"children":14909},{"style":395},[14910],{"type":23,"value":1869},{"type":17,"tag":36,"props":14912,"children":14913},{"style":411},[14914],{"type":23,"value":14480},{"type":17,"tag":36,"props":14916,"children":14917},{"style":80},[14918],{"type":23,"value":14919},") { }\n",{"type":17,"tag":36,"props":14921,"children":14922},{"class":38,"line":133},[14923],{"type":17,"tag":36,"props":14924,"children":14925},{"emptyLinePlaceholder":617},[14926],{"type":23,"value":620},{"type":17,"tag":36,"props":14928,"children":14929},{"class":38,"line":157},[14930],{"type":17,"tag":36,"props":14931,"children":14932},{"style":1805},[14933],{"type":23,"value":14934},"\u002F\u002F bar(123) error\n",{"type":17,"tag":36,"props":14936,"children":14937},{"class":38,"line":180},[14938,14943,14947,14951],{"type":17,"tag":36,"props":14939,"children":14940},{"style":411},[14941],{"type":23,"value":14942},"bar",{"type":17,"tag":36,"props":14944,"children":14945},{"style":80},[14946],{"type":23,"value":419},{"type":17,"tag":36,"props":14948,"children":14949},{"style":422},[14950],{"type":23,"value":11918},{"type":17,"tag":36,"props":14952,"children":14953},{"style":80},[14954],{"type":23,"value":430},{"type":17,"tag":323,"props":14956,"children":14957},{},[14958],{"type":17,"tag":1637,"props":14959,"children":14960},{},[14961],{"type":23,"value":14962},"参数必须拥有length属性",{"type":17,"tag":25,"props":14964,"children":14966},{"className":11179,"code":14965,"language":11119,"meta":7,"style":7},"type FunType = {\n length: number\n}\nfunction bar\u003CT extends FunType>(n: T) { }\n\n\u002F\u002F bar(123) error\nbar(\"张三\")\n",[14967],{"type":17,"tag":32,"props":14968,"children":14969},{"__ignoreMap":7},[14970,14989,15005,15012,15059,15066,15073],{"type":17,"tag":36,"props":14971,"children":14972},{"class":38,"line":39},[14973,14977,14981,14985],{"type":17,"tag":36,"props":14974,"children":14975},{"style":395},[14976],{"type":23,"value":11799},{"type":17,"tag":36,"props":14978,"children":14979},{"style":411},[14980],{"type":23,"value":14862},{"type":17,"tag":36,"props":14982,"children":14983},{"style":395},[14984],{"type":23,"value":408},{"type":17,"tag":36,"props":14986,"children":14987},{"style":80},[14988],{"type":23,"value":94},{"type":17,"tag":36,"props":14990,"children":14991},{"class":38,"line":48},[14992,14997,15001],{"type":17,"tag":36,"props":14993,"children":14994},{"style":1856},[14995],{"type":23,"value":14996}," length",{"type":17,"tag":36,"props":14998,"children":14999},{"style":395},[15000],{"type":23,"value":1869},{"type":17,"tag":36,"props":15002,"children":15003},{"style":105},[15004],{"type":23,"value":11847},{"type":17,"tag":36,"props":15006,"children":15007},{"class":38,"line":115},[15008],{"type":17,"tag":36,"props":15009,"children":15010},{"style":80},[15011],{"type":23,"value":291},{"type":17,"tag":36,"props":15013,"children":15014},{"class":38,"line":133},[15015,15019,15023,15027,15031,15035,15039,15043,15047,15051,15055],{"type":17,"tag":36,"props":15016,"children":15017},{"style":395},[15018],{"type":23,"value":12142},{"type":17,"tag":36,"props":15020,"children":15021},{"style":411},[15022],{"type":23,"value":14882},{"type":17,"tag":36,"props":15024,"children":15025},{"style":80},[15026],{"type":23,"value":528},{"type":17,"tag":36,"props":15028,"children":15029},{"style":411},[15030],{"type":23,"value":14343},{"type":17,"tag":36,"props":15032,"children":15033},{"style":395},[15034],{"type":23,"value":13541},{"type":17,"tag":36,"props":15036,"children":15037},{"style":411},[15038],{"type":23,"value":14862},{"type":17,"tag":36,"props":15040,"children":15041},{"style":80},[15042],{"type":23,"value":1103},{"type":17,"tag":36,"props":15044,"children":15045},{"style":1856},[15046],{"type":23,"value":12156},{"type":17,"tag":36,"props":15048,"children":15049},{"style":395},[15050],{"type":23,"value":1869},{"type":17,"tag":36,"props":15052,"children":15053},{"style":411},[15054],{"type":23,"value":14480},{"type":17,"tag":36,"props":15056,"children":15057},{"style":80},[15058],{"type":23,"value":14919},{"type":17,"tag":36,"props":15060,"children":15061},{"class":38,"line":157},[15062],{"type":17,"tag":36,"props":15063,"children":15064},{"emptyLinePlaceholder":617},[15065],{"type":23,"value":620},{"type":17,"tag":36,"props":15067,"children":15068},{"class":38,"line":180},[15069],{"type":17,"tag":36,"props":15070,"children":15071},{"style":1805},[15072],{"type":23,"value":14934},{"type":17,"tag":36,"props":15074,"children":15075},{"class":38,"line":202},[15076,15080,15084,15088],{"type":17,"tag":36,"props":15077,"children":15078},{"style":411},[15079],{"type":23,"value":14942},{"type":17,"tag":36,"props":15081,"children":15082},{"style":80},[15083],{"type":23,"value":419},{"type":17,"tag":36,"props":15085,"children":15086},{"style":422},[15087],{"type":23,"value":11918},{"type":17,"tag":36,"props":15089,"children":15090},{"style":80},[15091],{"type":23,"value":430},{"type":17,"tag":61,"props":15093,"children":15095},{"id":15094},"类型兼容性",[15096],{"type":23,"value":15094},{"type":17,"tag":368,"props":15098,"children":15099},{},[15100],{"type":17,"tag":323,"props":15101,"children":15102},{},[15103],{"type":23,"value":15104},"类型兼容性用于确定一个类型是否能赋值给其他类型",{"type":17,"tag":25,"props":15106,"children":15108},{"className":27,"code":15107,"language":29,"meta":7,"style":7},"let obj1 = { username: \"zhangsan\" }\nlet obj2 = { username: \"lisi\", age: 12 }\n\n\u002F\u002F obj1 = obj2\nobj2 = obj1 \u002F\u002F error\n\u002F\u002F 大的能赋值给小的\n\u002F\u002F 小的不能赋值给大的\n",[15109],{"type":17,"tag":32,"props":15110,"children":15111},{"__ignoreMap":7},[15112,15120,15128,15135,15143,15151,15159],{"type":17,"tag":36,"props":15113,"children":15114},{"class":38,"line":39},[15115],{"type":17,"tag":36,"props":15116,"children":15117},{},[15118],{"type":23,"value":15119},"let obj1 = { username: \"zhangsan\" }\n",{"type":17,"tag":36,"props":15121,"children":15122},{"class":38,"line":48},[15123],{"type":17,"tag":36,"props":15124,"children":15125},{},[15126],{"type":23,"value":15127},"let obj2 = { username: \"lisi\", age: 12 }\n",{"type":17,"tag":36,"props":15129,"children":15130},{"class":38,"line":115},[15131],{"type":17,"tag":36,"props":15132,"children":15133},{"emptyLinePlaceholder":617},[15134],{"type":23,"value":620},{"type":17,"tag":36,"props":15136,"children":15137},{"class":38,"line":133},[15138],{"type":17,"tag":36,"props":15139,"children":15140},{},[15141],{"type":23,"value":15142},"\u002F\u002F obj1 = obj2\n",{"type":17,"tag":36,"props":15144,"children":15145},{"class":38,"line":157},[15146],{"type":17,"tag":36,"props":15147,"children":15148},{},[15149],{"type":23,"value":15150},"obj2 = obj1 \u002F\u002F error\n",{"type":17,"tag":36,"props":15152,"children":15153},{"class":38,"line":180},[15154],{"type":17,"tag":36,"props":15155,"children":15156},{},[15157],{"type":23,"value":15158},"\u002F\u002F 大的能赋值给小的\n",{"type":17,"tag":36,"props":15160,"children":15161},{"class":38,"line":202},[15162],{"type":17,"tag":36,"props":15163,"children":15164},{},[15165],{"type":23,"value":15166},"\u002F\u002F 小的不能赋值给大的\n",{"type":17,"tag":61,"props":15168,"children":15170},{"id":15169},"映射类型与内置工具类",[15171],{"type":23,"value":15169},{"type":17,"tag":304,"props":15173,"children":15174},{"id":13253},[15175],{"type":23,"value":13253},{"type":17,"tag":368,"props":15177,"children":15178},{},[15179,15184],{"type":17,"tag":323,"props":15180,"children":15181},{},[15182],{"type":23,"value":15183},"将已知类型的每个属性都变为可选的或者只读的",{"type":17,"tag":323,"props":15185,"children":15186},{},[15187],{"type":23,"value":15188},"只能应用与类型别名。接口不支持",{"type":17,"tag":25,"props":15190,"children":15192},{"className":11179,"code":15191,"language":11119,"meta":7,"style":7},"type A = {\n username: string\n age: number\n}\n\ntype B\u003CT> = {\n [P in keyof T]: T[P]\n}\n\ntype C = B\u003CA> \u002F\u002F 相当于下面的代码\n\u002F\u002F type C = {\n\u002F\u002F username: string\n\u002F\u002F age: number\n\u002F\u002F }\n",[15193],{"type":17,"tag":32,"props":15194,"children":15195},{"__ignoreMap":7},[15196,15215,15230,15245,15252,15259,15290,15339,15346,15353,15392,15399,15406,15413],{"type":17,"tag":36,"props":15197,"children":15198},{"class":38,"line":39},[15199,15203,15207,15211],{"type":17,"tag":36,"props":15200,"children":15201},{"style":395},[15202],{"type":23,"value":11799},{"type":17,"tag":36,"props":15204,"children":15205},{"style":411},[15206],{"type":23,"value":11804},{"type":17,"tag":36,"props":15208,"children":15209},{"style":395},[15210],{"type":23,"value":408},{"type":17,"tag":36,"props":15212,"children":15213},{"style":80},[15214],{"type":23,"value":94},{"type":17,"tag":36,"props":15216,"children":15217},{"class":38,"line":48},[15218,15222,15226],{"type":17,"tag":36,"props":15219,"children":15220},{"style":1856},[15221],{"type":23,"value":11820},{"type":17,"tag":36,"props":15223,"children":15224},{"style":395},[15225],{"type":23,"value":1869},{"type":17,"tag":36,"props":15227,"children":15228},{"style":105},[15229],{"type":23,"value":11829},{"type":17,"tag":36,"props":15231,"children":15232},{"class":38,"line":115},[15233,15237,15241],{"type":17,"tag":36,"props":15234,"children":15235},{"style":1856},[15236],{"type":23,"value":11837},{"type":17,"tag":36,"props":15238,"children":15239},{"style":395},[15240],{"type":23,"value":1869},{"type":17,"tag":36,"props":15242,"children":15243},{"style":105},[15244],{"type":23,"value":11847},{"type":17,"tag":36,"props":15246,"children":15247},{"class":38,"line":133},[15248],{"type":17,"tag":36,"props":15249,"children":15250},{"style":80},[15251],{"type":23,"value":291},{"type":17,"tag":36,"props":15253,"children":15254},{"class":38,"line":157},[15255],{"type":17,"tag":36,"props":15256,"children":15257},{"emptyLinePlaceholder":617},[15258],{"type":23,"value":620},{"type":17,"tag":36,"props":15260,"children":15261},{"class":38,"line":180},[15262,15266,15270,15274,15278,15282,15286],{"type":17,"tag":36,"props":15263,"children":15264},{"style":395},[15265],{"type":23,"value":11799},{"type":17,"tag":36,"props":15267,"children":15268},{"style":411},[15269],{"type":23,"value":13340},{"type":17,"tag":36,"props":15271,"children":15272},{"style":80},[15273],{"type":23,"value":528},{"type":17,"tag":36,"props":15275,"children":15276},{"style":411},[15277],{"type":23,"value":14343},{"type":17,"tag":36,"props":15279,"children":15280},{"style":80},[15281],{"type":23,"value":14356},{"type":17,"tag":36,"props":15283,"children":15284},{"style":395},[15285],{"type":23,"value":482},{"type":17,"tag":36,"props":15287,"children":15288},{"style":80},[15289],{"type":23,"value":94},{"type":17,"tag":36,"props":15291,"children":15292},{"class":38,"line":202},[15293,15297,15301,15305,15310,15314,15318,15322,15326,15331,15335],{"type":17,"tag":36,"props":15294,"children":15295},{"style":80},[15296],{"type":23,"value":13683},{"type":17,"tag":36,"props":15298,"children":15299},{"style":411},[15300],{"type":23,"value":13688},{"type":17,"tag":36,"props":15302,"children":15303},{"style":395},[15304],{"type":23,"value":13693},{"type":17,"tag":36,"props":15306,"children":15307},{"style":395},[15308],{"type":23,"value":15309}," keyof",{"type":17,"tag":36,"props":15311,"children":15312},{"style":411},[15313],{"type":23,"value":14480},{"type":17,"tag":36,"props":15315,"children":15316},{"style":80},[15317],{"type":23,"value":13712},{"type":17,"tag":36,"props":15319,"children":15320},{"style":395},[15321],{"type":23,"value":1869},{"type":17,"tag":36,"props":15323,"children":15324},{"style":411},[15325],{"type":23,"value":14480},{"type":17,"tag":36,"props":15327,"children":15328},{"style":80},[15329],{"type":23,"value":15330},"[",{"type":17,"tag":36,"props":15332,"children":15333},{"style":411},[15334],{"type":23,"value":13688},{"type":17,"tag":36,"props":15336,"children":15337},{"style":80},[15338],{"type":23,"value":3963},{"type":17,"tag":36,"props":15340,"children":15341},{"class":38,"line":224},[15342],{"type":17,"tag":36,"props":15343,"children":15344},{"style":80},[15345],{"type":23,"value":291},{"type":17,"tag":36,"props":15347,"children":15348},{"class":38,"line":246},[15349],{"type":17,"tag":36,"props":15350,"children":15351},{"emptyLinePlaceholder":617},[15352],{"type":23,"value":620},{"type":17,"tag":36,"props":15354,"children":15355},{"class":38,"line":267},[15356,15360,15365,15369,15373,15377,15382,15387],{"type":17,"tag":36,"props":15357,"children":15358},{"style":395},[15359],{"type":23,"value":11799},{"type":17,"tag":36,"props":15361,"children":15362},{"style":411},[15363],{"type":23,"value":15364}," C",{"type":17,"tag":36,"props":15366,"children":15367},{"style":395},[15368],{"type":23,"value":408},{"type":17,"tag":36,"props":15370,"children":15371},{"style":411},[15372],{"type":23,"value":13340},{"type":17,"tag":36,"props":15374,"children":15375},{"style":80},[15376],{"type":23,"value":528},{"type":17,"tag":36,"props":15378,"children":15379},{"style":411},[15380],{"type":23,"value":15381},"A",{"type":17,"tag":36,"props":15383,"children":15384},{"style":80},[15385],{"type":23,"value":15386},"> ",{"type":17,"tag":36,"props":15388,"children":15389},{"style":1805},[15390],{"type":23,"value":15391},"\u002F\u002F 相当于下面的代码\n",{"type":17,"tag":36,"props":15393,"children":15394},{"class":38,"line":276},[15395],{"type":17,"tag":36,"props":15396,"children":15397},{"style":1805},[15398],{"type":23,"value":13425},{"type":17,"tag":36,"props":15400,"children":15401},{"class":38,"line":285},[15402],{"type":17,"tag":36,"props":15403,"children":15404},{"style":1805},[15405],{"type":23,"value":13433},{"type":17,"tag":36,"props":15407,"children":15408},{"class":38,"line":815},[15409],{"type":17,"tag":36,"props":15410,"children":15411},{"style":1805},[15412],{"type":23,"value":13457},{"type":17,"tag":36,"props":15414,"children":15415},{"class":38,"line":954},[15416],{"type":17,"tag":36,"props":15417,"children":15418},{"style":1805},[15419],{"type":23,"value":13441},{"type":17,"tag":304,"props":15421,"children":15423},{"id":15422},"内置工具类",[15424],{"type":23,"value":15422},{"type":17,"tag":368,"props":15426,"children":15427},{},[15428],{"type":17,"tag":323,"props":15429,"children":15430},{},[15431],{"type":23,"value":15432},"TypeScript内置了很多映射类型的工具",{"type":17,"tag":323,"props":15434,"children":15435},{},[15436],{"type":17,"tag":1637,"props":15437,"children":15438},{},[15439],{"type":23,"value":15440},"Readonly",{"type":17,"tag":25,"props":15442,"children":15444},{"className":11179,"code":15443,"language":11119,"meta":7,"style":7},"type A = {\n username: string\n age: number\n}\n\ntype B = Readonly\u003CA>\n",[15445],{"type":17,"tag":32,"props":15446,"children":15447},{"__ignoreMap":7},[15448,15467,15482,15497,15504,15511],{"type":17,"tag":36,"props":15449,"children":15450},{"class":38,"line":39},[15451,15455,15459,15463],{"type":17,"tag":36,"props":15452,"children":15453},{"style":395},[15454],{"type":23,"value":11799},{"type":17,"tag":36,"props":15456,"children":15457},{"style":411},[15458],{"type":23,"value":11804},{"type":17,"tag":36,"props":15460,"children":15461},{"style":395},[15462],{"type":23,"value":408},{"type":17,"tag":36,"props":15464,"children":15465},{"style":80},[15466],{"type":23,"value":94},{"type":17,"tag":36,"props":15468,"children":15469},{"class":38,"line":48},[15470,15474,15478],{"type":17,"tag":36,"props":15471,"children":15472},{"style":1856},[15473],{"type":23,"value":11820},{"type":17,"tag":36,"props":15475,"children":15476},{"style":395},[15477],{"type":23,"value":1869},{"type":17,"tag":36,"props":15479,"children":15480},{"style":105},[15481],{"type":23,"value":11829},{"type":17,"tag":36,"props":15483,"children":15484},{"class":38,"line":115},[15485,15489,15493],{"type":17,"tag":36,"props":15486,"children":15487},{"style":1856},[15488],{"type":23,"value":11837},{"type":17,"tag":36,"props":15490,"children":15491},{"style":395},[15492],{"type":23,"value":1869},{"type":17,"tag":36,"props":15494,"children":15495},{"style":105},[15496],{"type":23,"value":11847},{"type":17,"tag":36,"props":15498,"children":15499},{"class":38,"line":133},[15500],{"type":17,"tag":36,"props":15501,"children":15502},{"style":80},[15503],{"type":23,"value":291},{"type":17,"tag":36,"props":15505,"children":15506},{"class":38,"line":157},[15507],{"type":17,"tag":36,"props":15508,"children":15509},{"emptyLinePlaceholder":617},[15510],{"type":23,"value":620},{"type":17,"tag":36,"props":15512,"children":15513},{"class":38,"line":180},[15514,15518,15522,15526,15531,15535,15539],{"type":17,"tag":36,"props":15515,"children":15516},{"style":395},[15517],{"type":23,"value":11799},{"type":17,"tag":36,"props":15519,"children":15520},{"style":411},[15521],{"type":23,"value":13340},{"type":17,"tag":36,"props":15523,"children":15524},{"style":395},[15525],{"type":23,"value":408},{"type":17,"tag":36,"props":15527,"children":15528},{"style":411},[15529],{"type":23,"value":15530}," Readonly",{"type":17,"tag":36,"props":15532,"children":15533},{"style":80},[15534],{"type":23,"value":528},{"type":17,"tag":36,"props":15536,"children":15537},{"style":411},[15538],{"type":23,"value":15381},{"type":17,"tag":36,"props":15540,"children":15541},{"style":80},[15542],{"type":23,"value":543},{"type":17,"tag":61,"props":15544,"children":15546},{"id":15545},"条件类型与infer关键字",[15547],{"type":23,"value":15545},{"type":17,"tag":304,"props":15549,"children":15551},{"id":15550},"条件类型",[15552],{"type":23,"value":15550},{"type":17,"tag":368,"props":15554,"children":15555},{},[15556],{"type":17,"tag":323,"props":15557,"children":15558},{},[15559],{"type":23,"value":15560},"在初始状态并不直接确定具体类型，而是通过一定的类型运算得到最终的变量类型",{"type":17,"tag":25,"props":15562,"children":15564},{"className":27,"code":15563,"language":29,"meta":7,"style":7},"type A = string\ntype B = number | string\ntype C = A extends B ? {} : [] \u002F\u002F {}\n",[15565],{"type":17,"tag":32,"props":15566,"children":15567},{"__ignoreMap":7},[15568,15576,15584],{"type":17,"tag":36,"props":15569,"children":15570},{"class":38,"line":39},[15571],{"type":17,"tag":36,"props":15572,"children":15573},{},[15574],{"type":23,"value":15575},"type A = string\n",{"type":17,"tag":36,"props":15577,"children":15578},{"class":38,"line":48},[15579],{"type":17,"tag":36,"props":15580,"children":15581},{},[15582],{"type":23,"value":15583},"type B = number | string\n",{"type":17,"tag":36,"props":15585,"children":15586},{"class":38,"line":115},[15587],{"type":17,"tag":36,"props":15588,"children":15589},{},[15590],{"type":23,"value":15591},"type C = A extends B ? {} : [] \u002F\u002F {}\n",{"type":17,"tag":323,"props":15593,"children":15594},{},[15595],{"type":17,"tag":1637,"props":15596,"children":15597},{},[15598],{"type":23,"value":15422},{"type":17,"tag":25,"props":15600,"children":15602},{"className":11179,"code":15601,"language":11119,"meta":7,"style":7},"type A = Exclude\u003Cstring|number|boolean, string>\n",[15603],{"type":17,"tag":32,"props":15604,"children":15605},{"__ignoreMap":7},[15606],{"type":17,"tag":36,"props":15607,"children":15608},{"class":38,"line":39},[15609,15613,15617,15621,15626,15630,15634,15638,15642,15646,15651,15655,15659],{"type":17,"tag":36,"props":15610,"children":15611},{"style":395},[15612],{"type":23,"value":11799},{"type":17,"tag":36,"props":15614,"children":15615},{"style":411},[15616],{"type":23,"value":11804},{"type":17,"tag":36,"props":15618,"children":15619},{"style":395},[15620],{"type":23,"value":408},{"type":17,"tag":36,"props":15622,"children":15623},{"style":411},[15624],{"type":23,"value":15625}," Exclude",{"type":17,"tag":36,"props":15627,"children":15628},{"style":80},[15629],{"type":23,"value":528},{"type":17,"tag":36,"props":15631,"children":15632},{"style":105},[15633],{"type":23,"value":12304},{"type":17,"tag":36,"props":15635,"children":15636},{"style":395},[15637],{"type":23,"value":12282},{"type":17,"tag":36,"props":15639,"children":15640},{"style":105},[15641],{"type":23,"value":12287},{"type":17,"tag":36,"props":15643,"children":15644},{"style":395},[15645],{"type":23,"value":12282},{"type":17,"tag":36,"props":15647,"children":15648},{"style":105},[15649],{"type":23,"value":15650},"boolean",{"type":17,"tag":36,"props":15652,"children":15653},{"style":80},[15654],{"type":23,"value":3903},{"type":17,"tag":36,"props":15656,"children":15657},{"style":105},[15658],{"type":23,"value":12304},{"type":17,"tag":36,"props":15660,"children":15661},{"style":80},[15662],{"type":23,"value":543},{"type":17,"tag":18,"props":15664,"children":15666},{"id":15665},"vue3与typescript配合使用",[15667],{"type":23,"value":15668},"Vue3与TypeScript配合使用",{"type":17,"tag":61,"props":15670,"children":15672},{"id":15671},"dts声明文件与declare关键字",[15673],{"type":23,"value":15674},"d.ts声明文件与declare关键字",{"type":17,"tag":368,"props":15676,"children":15677},{},[15678,15691],{"type":17,"tag":323,"props":15679,"children":15680},{},[15681,15683,15689],{"type":23,"value":15682},"在TypeScript中以",{"type":17,"tag":32,"props":15684,"children":15686},{"className":15685},[],[15687],{"type":23,"value":15688},".d.ts",{"type":23,"value":15690},"为后缀的文件，我们称之为TypeSCript声明文件。它的主要作用是描述JavaScript模块内所有导出接口的类型信息",{"type":17,"tag":323,"props":15692,"children":15693},{},[15694],{"type":23,"value":15695},"使js文件能够在ts文件进行使用",{"type":17,"tag":25,"props":15697,"children":15699},{"className":11179,"code":15698,"language":11119,"meta":7,"style":7},"\u002F\u002F demo.d.ts\nexport declare function foo(n: number): void\n",[15700],{"type":17,"tag":32,"props":15701,"children":15702},{"__ignoreMap":7},[15703,15711],{"type":17,"tag":36,"props":15704,"children":15705},{"class":38,"line":39},[15706],{"type":17,"tag":36,"props":15707,"children":15708},{"style":1805},[15709],{"type":23,"value":15710},"\u002F\u002F demo.d.ts\n",{"type":17,"tag":36,"props":15712,"children":15713},{"class":38,"line":48},[15714,15718,15723,15728,15732,15736,15740,15744,15748,15752,15756],{"type":17,"tag":36,"props":15715,"children":15716},{"style":395},[15717],{"type":23,"value":3282},{"type":17,"tag":36,"props":15719,"children":15720},{"style":395},[15721],{"type":23,"value":15722}," declare",{"type":17,"tag":36,"props":15724,"children":15725},{"style":395},[15726],{"type":23,"value":15727}," function",{"type":17,"tag":36,"props":15729,"children":15730},{"style":411},[15731],{"type":23,"value":12147},{"type":17,"tag":36,"props":15733,"children":15734},{"style":80},[15735],{"type":23,"value":419},{"type":17,"tag":36,"props":15737,"children":15738},{"style":1856},[15739],{"type":23,"value":12156},{"type":17,"tag":36,"props":15741,"children":15742},{"style":395},[15743],{"type":23,"value":1869},{"type":17,"tag":36,"props":15745,"children":15746},{"style":105},[15747],{"type":23,"value":11493},{"type":17,"tag":36,"props":15749,"children":15750},{"style":80},[15751],{"type":23,"value":12187},{"type":17,"tag":36,"props":15753,"children":15754},{"style":395},[15755],{"type":23,"value":1869},{"type":17,"tag":36,"props":15757,"children":15758},{"style":105},[15759],{"type":23,"value":12528},{"type":17,"tag":61,"props":15761,"children":15763},{"id":15762},"types和definitelytyped仓库",[15764],{"type":23,"value":15765},"@types和DefinitelyTyped仓库",{"type":17,"tag":368,"props":15767,"children":15768},{},[15769],{"type":17,"tag":323,"props":15770,"children":15771},{},[15772],{"type":23,"value":15773},"Definitely是一个高质量的TypeScript类型定义的仓库。通过@types方式来安装常见的第三方JavaScript库的声明适配模块",{"type":17,"tag":323,"props":15775,"children":15776},{},[15777,15779,15784,15786,15792],{"type":23,"value":15778},"有一些第三方库没有",{"type":17,"tag":32,"props":15780,"children":15782},{"className":15781},[],[15783],{"type":23,"value":15688},{"type":23,"value":15785},"文件。可以通过",{"type":17,"tag":32,"props":15787,"children":15789},{"className":15788},[],[15790],{"type":23,"value":15791},"npm i --save-dev @types\u002Fjquery",{"type":23,"value":15793},"来自动生成",{"type":17,"tag":61,"props":15795,"children":15797},{"id":15796},"libdts与globaldts",[15798],{"type":23,"value":15799},"lib.d.ts与global.d.ts",{"type":17,"tag":368,"props":15801,"children":15802},{},[15803],{"type":17,"tag":323,"props":15804,"children":15805},{},[15806],{"type":23,"value":15807},"当你安装TypeScript时，会顺带安装一个lib.d.ts声明文件。这个文件包含JavaScript运行时以及DOM中存在各种常见的环境声明",{"type":17,"tag":304,"props":15809,"children":15811},{"id":15810},"globaldts",[15812],{"type":23,"value":15813},"global.d.ts",{"type":17,"tag":323,"props":15815,"children":15816},{},[15817],{"type":23,"value":15818},"在global.d.ts文件中定义的类型，在全局都可以使用",{"type":17,"tag":61,"props":15820,"children":15822},{"id":15821},"详解tsconfigjson",[15823],{"type":23,"value":15824},"详解tsconfig.json",{"type":17,"tag":1695,"props":15826,"children":15827},{},[15828,15833,15843,15848,15858,15868],{"type":17,"tag":1699,"props":15829,"children":15830},{},[15831],{"type":23,"value":15832},"compilerOptions:{}——编译选项",{"type":17,"tag":1699,"props":15834,"children":15835},{},[15836,15838,15841],{"type":23,"value":15837},"files:",{"type":17,"tag":36,"props":15839,"children":15840},{},[],{"type":23,"value":15842},"——包含在程序中的文件的允许列表",{"type":17,"tag":1699,"props":15844,"children":15845},{},[15846],{"type":23,"value":15847},"extends:\" \"——继承的另一个配置文件",{"type":17,"tag":1699,"props":15849,"children":15850},{},[15851,15853,15856],{"type":23,"value":15852},"include:",{"type":17,"tag":36,"props":15854,"children":15855},{},[],{"type":23,"value":15857}," —— 指定的进行编译解析",{"type":17,"tag":1699,"props":15859,"children":15860},{},[15861,15863,15866],{"type":23,"value":15862},"exclude:",{"type":17,"tag":36,"props":15864,"children":15865},{},[],{"type":23,"value":15867}," ——指定的不进行编译解析",{"type":17,"tag":1699,"props":15869,"children":15870},{},[15871,15873,15876],{"type":23,"value":15872},"references:",{"type":17,"tag":36,"props":15874,"children":15875},{},[],{"type":23,"value":15877},"——项目引用，提高性能",{"type":17,"tag":61,"props":15879,"children":15881},{"id":15880},"组合式api与ts",[15882],{"type":23,"value":15883},"组合式API与TS",{"type":17,"tag":304,"props":15885,"children":15887},{"id":15886},"与ref-配合",[15888],{"type":23,"value":15889},"与ref 配合",{"type":17,"tag":25,"props":15891,"children":15893},{"className":11179,"code":15892,"language":11119,"meta":7,"style":7},"let count = ref\u003Cnumber|string>(0)\ncount.value = \"hello\"\n\ninterface List {\n username: string\n age: number\n}\n\nlet list = ref\u003CList[]>([]) \n\nlist.value.push({\n username: \"world\",\n age: 12\n})\n",[15894],{"type":17,"tag":32,"props":15895,"children":15896},{"__ignoreMap":7},[15897,15944,15961,15968,15984,15999,16014,16021,16028,16062,16069,16085,16101,16112],{"type":17,"tag":36,"props":15898,"children":15899},{"class":38,"line":39},[15900,15904,15908,15912,15916,15920,15924,15928,15932,15936,15940],{"type":17,"tag":36,"props":15901,"children":15902},{"style":395},[15903],{"type":23,"value":472},{"type":17,"tag":36,"props":15905,"children":15906},{"style":80},[15907],{"type":23,"value":8168},{"type":17,"tag":36,"props":15909,"children":15910},{"style":395},[15911],{"type":23,"value":482},{"type":17,"tag":36,"props":15913,"children":15914},{"style":411},[15915],{"type":23,"value":414},{"type":17,"tag":36,"props":15917,"children":15918},{"style":80},[15919],{"type":23,"value":528},{"type":17,"tag":36,"props":15921,"children":15922},{"style":105},[15923],{"type":23,"value":12287},{"type":17,"tag":36,"props":15925,"children":15926},{"style":395},[15927],{"type":23,"value":12282},{"type":17,"tag":36,"props":15929,"children":15930},{"style":105},[15931],{"type":23,"value":12304},{"type":17,"tag":36,"props":15933,"children":15934},{"style":80},[15935],{"type":23,"value":1103},{"type":17,"tag":36,"props":15937,"children":15938},{"style":105},[15939],{"type":23,"value":217},{"type":17,"tag":36,"props":15941,"children":15942},{"style":80},[15943],{"type":23,"value":430},{"type":17,"tag":36,"props":15945,"children":15946},{"class":38,"line":48},[15947,15952,15956],{"type":17,"tag":36,"props":15948,"children":15949},{"style":80},[15950],{"type":23,"value":15951},"count.value ",{"type":17,"tag":36,"props":15953,"children":15954},{"style":395},[15955],{"type":23,"value":482},{"type":17,"tag":36,"props":15957,"children":15958},{"style":422},[15959],{"type":23,"value":15960}," \"hello\"\n",{"type":17,"tag":36,"props":15962,"children":15963},{"class":38,"line":115},[15964],{"type":17,"tag":36,"props":15965,"children":15966},{"emptyLinePlaceholder":617},[15967],{"type":23,"value":620},{"type":17,"tag":36,"props":15969,"children":15970},{"class":38,"line":133},[15971,15975,15980],{"type":17,"tag":36,"props":15972,"children":15973},{"style":395},[15974],{"type":23,"value":13335},{"type":17,"tag":36,"props":15976,"children":15977},{"style":411},[15978],{"type":23,"value":15979}," List",{"type":17,"tag":36,"props":15981,"children":15982},{"style":80},[15983],{"type":23,"value":94},{"type":17,"tag":36,"props":15985,"children":15986},{"class":38,"line":157},[15987,15991,15995],{"type":17,"tag":36,"props":15988,"children":15989},{"style":1856},[15990],{"type":23,"value":11820},{"type":17,"tag":36,"props":15992,"children":15993},{"style":395},[15994],{"type":23,"value":1869},{"type":17,"tag":36,"props":15996,"children":15997},{"style":105},[15998],{"type":23,"value":11829},{"type":17,"tag":36,"props":16000,"children":16001},{"class":38,"line":180},[16002,16006,16010],{"type":17,"tag":36,"props":16003,"children":16004},{"style":1856},[16005],{"type":23,"value":11837},{"type":17,"tag":36,"props":16007,"children":16008},{"style":395},[16009],{"type":23,"value":1869},{"type":17,"tag":36,"props":16011,"children":16012},{"style":105},[16013],{"type":23,"value":11847},{"type":17,"tag":36,"props":16015,"children":16016},{"class":38,"line":202},[16017],{"type":17,"tag":36,"props":16018,"children":16019},{"style":80},[16020],{"type":23,"value":291},{"type":17,"tag":36,"props":16022,"children":16023},{"class":38,"line":224},[16024],{"type":17,"tag":36,"props":16025,"children":16026},{"emptyLinePlaceholder":617},[16027],{"type":23,"value":620},{"type":17,"tag":36,"props":16029,"children":16030},{"class":38,"line":246},[16031,16035,16040,16044,16048,16052,16057],{"type":17,"tag":36,"props":16032,"children":16033},{"style":395},[16034],{"type":23,"value":472},{"type":17,"tag":36,"props":16036,"children":16037},{"style":80},[16038],{"type":23,"value":16039}," list ",{"type":17,"tag":36,"props":16041,"children":16042},{"style":395},[16043],{"type":23,"value":482},{"type":17,"tag":36,"props":16045,"children":16046},{"style":411},[16047],{"type":23,"value":414},{"type":17,"tag":36,"props":16049,"children":16050},{"style":80},[16051],{"type":23,"value":528},{"type":17,"tag":36,"props":16053,"children":16054},{"style":411},[16055],{"type":23,"value":16056},"List",{"type":17,"tag":36,"props":16058,"children":16059},{"style":80},[16060],{"type":23,"value":16061},"[]>([]) \n",{"type":17,"tag":36,"props":16063,"children":16064},{"class":38,"line":267},[16065],{"type":17,"tag":36,"props":16066,"children":16067},{"emptyLinePlaceholder":617},[16068],{"type":23,"value":620},{"type":17,"tag":36,"props":16070,"children":16071},{"class":38,"line":276},[16072,16077,16081],{"type":17,"tag":36,"props":16073,"children":16074},{"style":80},[16075],{"type":23,"value":16076},"list.value.",{"type":17,"tag":36,"props":16078,"children":16079},{"style":411},[16080],{"type":23,"value":10555},{"type":17,"tag":36,"props":16082,"children":16083},{"style":80},[16084],{"type":23,"value":9914},{"type":17,"tag":36,"props":16086,"children":16087},{"class":38,"line":285},[16088,16092,16097],{"type":17,"tag":36,"props":16089,"children":16090},{"style":80},[16091],{"type":23,"value":11913},{"type":17,"tag":36,"props":16093,"children":16094},{"style":422},[16095],{"type":23,"value":16096},"\"world\"",{"type":17,"tag":36,"props":16098,"children":16099},{"style":80},[16100],{"type":23,"value":3309},{"type":17,"tag":36,"props":16102,"children":16103},{"class":38,"line":815},[16104,16108],{"type":17,"tag":36,"props":16105,"children":16106},{"style":80},[16107],{"type":23,"value":11930},{"type":17,"tag":36,"props":16109,"children":16110},{"style":105},[16111],{"type":23,"value":13633},{"type":17,"tag":36,"props":16113,"children":16114},{"class":38,"line":954},[16115],{"type":17,"tag":36,"props":16116,"children":16117},{"style":80},[16118],{"type":23,"value":1617},{"type":17,"tag":304,"props":16120,"children":16122},{"id":16121},"与defineprops配合",[16123],{"type":23,"value":16124},"与defineProps配合",{"type":17,"tag":25,"props":16126,"children":16128},{"className":11179,"code":16127,"language":11119,"meta":7,"style":7},"\u002F\u002F 1.\ndefineProps({\n count: [Number, String]\n})\n\n\u002F\u002F 2.\ninterface Props {\n count: number|string\n list: {username: string; age: number}[]\n}\ndefineProps\u003CProps>()\n",[16129],{"type":17,"tag":32,"props":16130,"children":16131},{"__ignoreMap":7},[16132,16140,16152,16160,16167,16174,16182,16198,16223,16272,16279],{"type":17,"tag":36,"props":16133,"children":16134},{"class":38,"line":39},[16135],{"type":17,"tag":36,"props":16136,"children":16137},{"style":1805},[16138],{"type":23,"value":16139},"\u002F\u002F 1.\n",{"type":17,"tag":36,"props":16141,"children":16142},{"class":38,"line":48},[16143,16148],{"type":17,"tag":36,"props":16144,"children":16145},{"style":411},[16146],{"type":23,"value":16147},"defineProps",{"type":17,"tag":36,"props":16149,"children":16150},{"style":80},[16151],{"type":23,"value":9914},{"type":17,"tag":36,"props":16153,"children":16154},{"class":38,"line":115},[16155],{"type":17,"tag":36,"props":16156,"children":16157},{"style":80},[16158],{"type":23,"value":16159}," count: [Number, String]\n",{"type":17,"tag":36,"props":16161,"children":16162},{"class":38,"line":133},[16163],{"type":17,"tag":36,"props":16164,"children":16165},{"style":80},[16166],{"type":23,"value":1617},{"type":17,"tag":36,"props":16168,"children":16169},{"class":38,"line":157},[16170],{"type":17,"tag":36,"props":16171,"children":16172},{"emptyLinePlaceholder":617},[16173],{"type":23,"value":620},{"type":17,"tag":36,"props":16175,"children":16176},{"class":38,"line":180},[16177],{"type":17,"tag":36,"props":16178,"children":16179},{"style":1805},[16180],{"type":23,"value":16181},"\u002F\u002F 2.\n",{"type":17,"tag":36,"props":16183,"children":16184},{"class":38,"line":202},[16185,16189,16194],{"type":17,"tag":36,"props":16186,"children":16187},{"style":395},[16188],{"type":23,"value":13335},{"type":17,"tag":36,"props":16190,"children":16191},{"style":411},[16192],{"type":23,"value":16193}," Props",{"type":17,"tag":36,"props":16195,"children":16196},{"style":80},[16197],{"type":23,"value":94},{"type":17,"tag":36,"props":16199,"children":16200},{"class":38,"line":224},[16201,16206,16210,16214,16218],{"type":17,"tag":36,"props":16202,"children":16203},{"style":1856},[16204],{"type":23,"value":16205}," count",{"type":17,"tag":36,"props":16207,"children":16208},{"style":395},[16209],{"type":23,"value":1869},{"type":17,"tag":36,"props":16211,"children":16212},{"style":105},[16213],{"type":23,"value":11493},{"type":17,"tag":36,"props":16215,"children":16216},{"style":395},[16217],{"type":23,"value":12282},{"type":17,"tag":36,"props":16219,"children":16220},{"style":105},[16221],{"type":23,"value":16222},"string\n",{"type":17,"tag":36,"props":16224,"children":16225},{"class":38,"line":246},[16226,16231,16235,16239,16243,16247,16251,16255,16259,16263,16267],{"type":17,"tag":36,"props":16227,"children":16228},{"style":1856},[16229],{"type":23,"value":16230}," list",{"type":17,"tag":36,"props":16232,"children":16233},{"style":395},[16234],{"type":23,"value":1869},{"type":17,"tag":36,"props":16236,"children":16237},{"style":80},[16238],{"type":23,"value":1853},{"type":17,"tag":36,"props":16240,"children":16241},{"style":1856},[16242],{"type":23,"value":13907},{"type":17,"tag":36,"props":16244,"children":16245},{"style":395},[16246],{"type":23,"value":1869},{"type":17,"tag":36,"props":16248,"children":16249},{"style":105},[16250],{"type":23,"value":12182},{"type":17,"tag":36,"props":16252,"children":16253},{"style":80},[16254],{"type":23,"value":888},{"type":17,"tag":36,"props":16256,"children":16257},{"style":1856},[16258],{"type":23,"value":13932},{"type":17,"tag":36,"props":16260,"children":16261},{"style":395},[16262],{"type":23,"value":1869},{"type":17,"tag":36,"props":16264,"children":16265},{"style":105},[16266],{"type":23,"value":11493},{"type":17,"tag":36,"props":16268,"children":16269},{"style":80},[16270],{"type":23,"value":16271},"}[]\n",{"type":17,"tag":36,"props":16273,"children":16274},{"class":38,"line":267},[16275],{"type":17,"tag":36,"props":16276,"children":16277},{"style":80},[16278],{"type":23,"value":291},{"type":17,"tag":36,"props":16280,"children":16281},{"class":38,"line":276},[16282,16286,16290,16295],{"type":17,"tag":36,"props":16283,"children":16284},{"style":411},[16285],{"type":23,"value":16147},{"type":17,"tag":36,"props":16287,"children":16288},{"style":80},[16289],{"type":23,"value":528},{"type":17,"tag":36,"props":16291,"children":16292},{"style":411},[16293],{"type":23,"value":16294},"Props",{"type":17,"tag":36,"props":16296,"children":16297},{"style":80},[16298],{"type":23,"value":16299},">()\n",{"type":17,"tag":304,"props":16301,"children":16303},{"id":16302},"与defineemits配合",[16304],{"type":23,"value":16305},"与defineEmits配合",{"type":17,"tag":25,"props":16307,"children":16309},{"className":11179,"code":16308,"language":11119,"meta":7,"style":7},"interface Emits {\n (e: 'getData', payload: string): void\n}\n\nlet emit = defineEmits\u003CEmits>()\nemit(\"getData\", \"hello\")\n",[16310],{"type":17,"tag":32,"props":16311,"children":16312},{"__ignoreMap":7},[16313,16329,16379,16386,16393,16426],{"type":17,"tag":36,"props":16314,"children":16315},{"class":38,"line":39},[16316,16320,16325],{"type":17,"tag":36,"props":16317,"children":16318},{"style":395},[16319],{"type":23,"value":13335},{"type":17,"tag":36,"props":16321,"children":16322},{"style":411},[16323],{"type":23,"value":16324}," Emits",{"type":17,"tag":36,"props":16326,"children":16327},{"style":80},[16328],{"type":23,"value":94},{"type":17,"tag":36,"props":16330,"children":16331},{"class":38,"line":48},[16332,16336,16341,16345,16350,16354,16359,16363,16367,16371,16375],{"type":17,"tag":36,"props":16333,"children":16334},{"style":80},[16335],{"type":23,"value":12616},{"type":17,"tag":36,"props":16337,"children":16338},{"style":1856},[16339],{"type":23,"value":16340},"e",{"type":17,"tag":36,"props":16342,"children":16343},{"style":395},[16344],{"type":23,"value":1869},{"type":17,"tag":36,"props":16346,"children":16347},{"style":422},[16348],{"type":23,"value":16349}," 'getData'",{"type":17,"tag":36,"props":16351,"children":16352},{"style":80},[16353],{"type":23,"value":3903},{"type":17,"tag":36,"props":16355,"children":16356},{"style":1856},[16357],{"type":23,"value":16358},"payload",{"type":17,"tag":36,"props":16360,"children":16361},{"style":395},[16362],{"type":23,"value":1869},{"type":17,"tag":36,"props":16364,"children":16365},{"style":105},[16366],{"type":23,"value":12182},{"type":17,"tag":36,"props":16368,"children":16369},{"style":80},[16370],{"type":23,"value":12187},{"type":17,"tag":36,"props":16372,"children":16373},{"style":395},[16374],{"type":23,"value":1869},{"type":17,"tag":36,"props":16376,"children":16377},{"style":105},[16378],{"type":23,"value":12528},{"type":17,"tag":36,"props":16380,"children":16381},{"class":38,"line":115},[16382],{"type":17,"tag":36,"props":16383,"children":16384},{"style":80},[16385],{"type":23,"value":291},{"type":17,"tag":36,"props":16387,"children":16388},{"class":38,"line":133},[16389],{"type":17,"tag":36,"props":16390,"children":16391},{"emptyLinePlaceholder":617},[16392],{"type":23,"value":620},{"type":17,"tag":36,"props":16394,"children":16395},{"class":38,"line":157},[16396,16400,16405,16409,16413,16417,16422],{"type":17,"tag":36,"props":16397,"children":16398},{"style":395},[16399],{"type":23,"value":472},{"type":17,"tag":36,"props":16401,"children":16402},{"style":80},[16403],{"type":23,"value":16404}," emit ",{"type":17,"tag":36,"props":16406,"children":16407},{"style":395},[16408],{"type":23,"value":482},{"type":17,"tag":36,"props":16410,"children":16411},{"style":411},[16412],{"type":23,"value":9995},{"type":17,"tag":36,"props":16414,"children":16415},{"style":80},[16416],{"type":23,"value":528},{"type":17,"tag":36,"props":16418,"children":16419},{"style":411},[16420],{"type":23,"value":16421},"Emits",{"type":17,"tag":36,"props":16423,"children":16424},{"style":80},[16425],{"type":23,"value":16299},{"type":17,"tag":36,"props":16427,"children":16428},{"class":38,"line":180},[16429,16434,16438,16443,16447,16452],{"type":17,"tag":36,"props":16430,"children":16431},{"style":411},[16432],{"type":23,"value":16433},"emit",{"type":17,"tag":36,"props":16435,"children":16436},{"style":80},[16437],{"type":23,"value":419},{"type":17,"tag":36,"props":16439,"children":16440},{"style":422},[16441],{"type":23,"value":16442},"\"getData\"",{"type":17,"tag":36,"props":16444,"children":16445},{"style":80},[16446],{"type":23,"value":3903},{"type":17,"tag":36,"props":16448,"children":16449},{"style":422},[16450],{"type":23,"value":16451},"\"hello\"",{"type":17,"tag":36,"props":16453,"children":16454},{"style":80},[16455],{"type":23,"value":430},{"type":17,"tag":61,"props":16457,"children":16459},{"id":16458},"vue_router与ts配合",[16460],{"type":23,"value":16461},"Vue_Router与TS配合",{"type":17,"tag":304,"props":16463,"children":16465},{"id":16464},"routes",[16466],{"type":23,"value":16464},{"type":17,"tag":25,"props":16468,"children":16470},{"className":11179,"code":16469,"language":11119,"meta":7,"style":7},"import type { RouteReCordRaw } from 'vue-router'\n\nconst routes: Array\u003CRouteReCordRaw> = []\n",[16471],{"type":17,"tag":32,"props":16472,"children":16473},{"__ignoreMap":7},[16474,16498,16505],{"type":17,"tag":36,"props":16475,"children":16476},{"class":38,"line":39},[16477,16481,16485,16490,16494],{"type":17,"tag":36,"props":16478,"children":16479},{"style":395},[16480],{"type":23,"value":1768},{"type":17,"tag":36,"props":16482,"children":16483},{"style":395},[16484],{"type":23,"value":2467},{"type":17,"tag":36,"props":16486,"children":16487},{"style":80},[16488],{"type":23,"value":16489}," { RouteReCordRaw } ",{"type":17,"tag":36,"props":16491,"children":16492},{"style":395},[16493],{"type":23,"value":1047},{"type":17,"tag":36,"props":16495,"children":16496},{"style":422},[16497],{"type":23,"value":10482},{"type":17,"tag":36,"props":16499,"children":16500},{"class":38,"line":48},[16501],{"type":17,"tag":36,"props":16502,"children":16503},{"emptyLinePlaceholder":617},[16504],{"type":23,"value":620},{"type":17,"tag":36,"props":16506,"children":16507},{"class":38,"line":115},[16508,16512,16517,16521,16526,16530,16535,16539,16543],{"type":17,"tag":36,"props":16509,"children":16510},{"style":395},[16511],{"type":23,"value":398},{"type":17,"tag":36,"props":16513,"children":16514},{"style":105},[16515],{"type":23,"value":16516}," routes",{"type":17,"tag":36,"props":16518,"children":16519},{"style":395},[16520],{"type":23,"value":1869},{"type":17,"tag":36,"props":16522,"children":16523},{"style":411},[16524],{"type":23,"value":16525}," Array",{"type":17,"tag":36,"props":16527,"children":16528},{"style":80},[16529],{"type":23,"value":528},{"type":17,"tag":36,"props":16531,"children":16532},{"style":411},[16533],{"type":23,"value":16534},"RouteReCordRaw",{"type":17,"tag":36,"props":16536,"children":16537},{"style":80},[16538],{"type":23,"value":14356},{"type":17,"tag":36,"props":16540,"children":16541},{"style":395},[16542],{"type":23,"value":482},{"type":17,"tag":36,"props":16544,"children":16545},{"style":80},[16546],{"type":23,"value":16547}," []\n",{"type":17,"tag":304,"props":16549,"children":16551},{"id":16550},"routes中的meta",[16552],{"type":23,"value":16550},{"type":17,"tag":25,"props":16554,"children":16556},{"className":11179,"code":16555,"language":11119,"meta":7,"style":7},"declare module 'vue-router' {\n interface RouteMeta {\n isAdmin?: boolean\n requiresAuth: boolean\n }\n}\n",[16557],{"type":17,"tag":32,"props":16558,"children":16559},{"__ignoreMap":7},[16560,16582,16599,16616,16632,16639],{"type":17,"tag":36,"props":16561,"children":16562},{"class":38,"line":39},[16563,16568,16573,16578],{"type":17,"tag":36,"props":16564,"children":16565},{"style":395},[16566],{"type":23,"value":16567},"declare",{"type":17,"tag":36,"props":16569,"children":16570},{"style":395},[16571],{"type":23,"value":16572}," module",{"type":17,"tag":36,"props":16574,"children":16575},{"style":422},[16576],{"type":23,"value":16577}," 'vue-router'",{"type":17,"tag":36,"props":16579,"children":16580},{"style":80},[16581],{"type":23,"value":94},{"type":17,"tag":36,"props":16583,"children":16584},{"class":38,"line":48},[16585,16590,16595],{"type":17,"tag":36,"props":16586,"children":16587},{"style":395},[16588],{"type":23,"value":16589}," interface",{"type":17,"tag":36,"props":16591,"children":16592},{"style":411},[16593],{"type":23,"value":16594}," RouteMeta",{"type":17,"tag":36,"props":16596,"children":16597},{"style":80},[16598],{"type":23,"value":94},{"type":17,"tag":36,"props":16600,"children":16601},{"class":38,"line":115},[16602,16607,16611],{"type":17,"tag":36,"props":16603,"children":16604},{"style":1856},[16605],{"type":23,"value":16606}," isAdmin",{"type":17,"tag":36,"props":16608,"children":16609},{"style":395},[16610],{"type":23,"value":11842},{"type":17,"tag":36,"props":16612,"children":16613},{"style":105},[16614],{"type":23,"value":16615}," boolean\n",{"type":17,"tag":36,"props":16617,"children":16618},{"class":38,"line":133},[16619,16624,16628],{"type":17,"tag":36,"props":16620,"children":16621},{"style":1856},[16622],{"type":23,"value":16623}," requiresAuth",{"type":17,"tag":36,"props":16625,"children":16626},{"style":395},[16627],{"type":23,"value":1869},{"type":17,"tag":36,"props":16629,"children":16630},{"style":105},[16631],{"type":23,"value":16615},{"type":17,"tag":36,"props":16633,"children":16634},{"class":38,"line":157},[16635],{"type":17,"tag":36,"props":16636,"children":16637},{"style":80},[16638],{"type":23,"value":273},{"type":17,"tag":36,"props":16640,"children":16641},{"class":38,"line":180},[16642],{"type":17,"tag":36,"props":16643,"children":16644},{"style":80},[16645],{"type":23,"value":291},{"type":17,"tag":61,"props":16647,"children":16649},{"id":16648},"element-plus与ts",[16650],{"type":23,"value":16651},"Element Plus与TS",{"type":17,"tag":505,"props":16653,"children":16654},{},[16655],{"type":23,"value":16656},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}",{"title":7,"searchDepth":48,"depth":48,"links":16658},[16659,16660,16674,16689,16696,16703,16704,16705,16706,16707,16708,16712,16717,16721,16722,16723,16724,16727,16730,16731,16735,16738,16739,16740,16743,16744,16749,16753],{"id":63,"depth":48,"text":63},{"id":300,"depth":48,"text":300,"children":16661},[16662,16663,16664,16665,16666,16667,16668,16669,16670,16671,16672,16673],{"id":306,"depth":115,"text":314},{"id":364,"depth":115,"text":364},{"id":502,"depth":115,"text":502},{"id":987,"depth":115,"text":987},{"id":1253,"depth":115,"text":1256},{"id":1620,"depth":115,"text":1620},{"id":1630,"depth":115,"text":1630},{"id":1691,"depth":115,"text":1691},{"id":1706,"depth":115,"text":1706},{"id":1999,"depth":115,"text":2002},{"id":2258,"depth":115,"text":63},{"id":2316,"depth":115,"text":2319},{"id":2386,"depth":48,"text":2389,"children":16675},[16676,16677,16678,16679,16680,16681,16682,16683,16684,16685,16686,16687,16688],{"id":2392,"depth":115,"text":2392},{"id":2411,"depth":115,"text":2411},{"id":2432,"depth":115,"text":2432},{"id":2519,"depth":115,"text":2519},{"id":2578,"depth":115,"text":2578},{"id":2618,"depth":115,"text":2618},{"id":3137,"depth":115,"text":3140},{"id":3666,"depth":115,"text":3666},{"id":4399,"depth":115,"text":4399},{"id":5474,"depth":115,"text":5474},{"id":6106,"depth":115,"text":6109},{"id":6829,"depth":115,"text":6829},{"id":7536,"depth":115,"text":7536},{"id":7743,"depth":48,"text":7746,"children":16690},[16691,16692,16693,16694,16695],{"id":7749,"depth":115,"text":7752},{"id":8015,"depth":115,"text":8015},{"id":8322,"depth":115,"text":8325},{"id":8889,"depth":115,"text":8892},{"id":9472,"depth":115,"text":9475},{"id":10083,"depth":48,"text":10086,"children":16697},[16698,16699,16700,16701,16702],{"id":10089,"depth":115,"text":10089},{"id":10132,"depth":115,"text":10132},{"id":10244,"depth":115,"text":10244},{"id":10736,"depth":115,"text":10736},{"id":10793,"depth":115,"text":10793},{"id":10808,"depth":48,"text":10808},{"id":11125,"depth":48,"text":11125},{"id":11160,"depth":48,"text":11163},{"id":11379,"depth":48,"text":11379},{"id":11534,"depth":48,"text":11537},{"id":11684,"depth":48,"text":11684,"children":16709},[16710,16711],{"id":11689,"depth":115,"text":11689},{"id":11724,"depth":115,"text":11724},{"id":11764,"depth":48,"text":11764,"children":16713},[16714,16715,16716],{"id":11777,"depth":115,"text":11777},{"id":11979,"depth":115,"text":11979},{"id":12034,"depth":115,"text":502},{"id":12112,"depth":48,"text":12112,"children":16718},[16719,16720],{"id":12117,"depth":115,"text":12117},{"id":12421,"depth":115,"text":12421},{"id":13126,"depth":48,"text":13126},{"id":13215,"depth":48,"text":13215},{"id":13760,"depth":48,"text":13760},{"id":13826,"depth":48,"text":13826,"children":16725},[16726],{"id":13831,"depth":115,"text":13831},{"id":14298,"depth":48,"text":14298,"children":16728},[16729],{"id":14825,"depth":115,"text":14825},{"id":15094,"depth":48,"text":15094},{"id":15169,"depth":48,"text":15169,"children":16732},[16733,16734],{"id":13253,"depth":115,"text":13253},{"id":15422,"depth":115,"text":15422},{"id":15545,"depth":48,"text":15545,"children":16736},[16737],{"id":15550,"depth":115,"text":15550},{"id":15671,"depth":48,"text":15674},{"id":15762,"depth":48,"text":15765},{"id":15796,"depth":48,"text":15799,"children":16741},[16742],{"id":15810,"depth":115,"text":15813},{"id":15821,"depth":48,"text":15824},{"id":15880,"depth":48,"text":15883,"children":16745},[16746,16747,16748],{"id":15886,"depth":115,"text":15889},{"id":16121,"depth":115,"text":16124},{"id":16302,"depth":115,"text":16305},{"id":16458,"depth":48,"text":16461,"children":16750},[16751,16752],{"id":16464,"depth":115,"text":16464},{"id":16550,"depth":115,"text":16550},{"id":16648,"depth":48,"text":16651},"markdown","content:articles:frontend:Vue3与TypeScript.md","content","articles\u002Ffrontend\u002FVue3与TypeScript.md","articles\u002Ffrontend\u002FVue3与TypeScript","md",1779811690148]