[{"data":1,"prerenderedAt":1141},["ShallowReactive",2],{"blog-\u002Fblog\u002Fwechat_mini_program_swiper_plus_scroll_view_equals_what":3},{"id":4,"title":5,"body":6,"category":1129,"cover":1130,"csdn":1130,"date":1131,"description":5,"draft":1132,"extension":1133,"meta":1134,"navigation":274,"path":1135,"seo":1136,"stem":1137,"tags":1138,"updated":1130,"__hash__":1140},"blog\u002Fblog\u002Fwechat_mini_program_swiper_plus_scroll_view_equals_what.md","微信小程序 swiper + scroll-view = ？",{"type":7,"value":8,"toc":1115},"minimark",[9,14,22,26,34,39,42,47,51,363,711,1053,1056,1064,1074,1078,1082,1086,1094,1098,1108,1111],[10,11,13],"h2",{"id":12},"最近用-swiper-scroll-view-做了一个好玩的提升用户体验看下图","最近用 swiper + scroll-view 做了一个好玩的（提升用户体验）看下图",[15,16,17],"p",{},[18,19],"img",{"alt":20,"src":21},"在这里插入图片描述","https:\u002F\u002Fpub-5ec96507162a4f0a8e713a916117c9f4.r2.dev\u002Fblog\u002Fc378069bec003ec7c6ea35659641b411.gif#pic_center",[10,23,25],{"id":24},"很多-app-中都有具体应用场景-微信小程序订单-淘宝首页-qq-音乐","很多 app 中都有具体应用场景 (微信小程序订单) (淘宝首页) (QQ 音乐)",[15,27,28,31],{},[18,29],{"alt":20,"src":30},"https:\u002F\u002Fpub-5ec96507162a4f0a8e713a916117c9f4.r2.dev\u002Fblog\u002F2a7e6b459ba93d604df13860498e41fb.png#pic_center",[18,32],{"alt":20,"src":33},"https:\u002F\u002Fpub-5ec96507162a4f0a8e713a916117c9f4.r2.dev\u002Fblog\u002F5eee25887683040c81ccc3d67d2089b5.png#pic_center",[15,35,36],{},[18,37],{"alt":20,"src":38},"https:\u002F\u002Fpub-5ec96507162a4f0a8e713a916117c9f4.r2.dev\u002Fblog\u002F8e851872f098ff22cda6c35a32664adc.png#pic_center",[10,40,41],{"id":41},"我在小程序中的应用",[15,43,44],{},[18,45],{"alt":20,"src":46},"https:\u002F\u002Fpub-5ec96507162a4f0a8e713a916117c9f4.r2.dev\u002Fblog\u002F3cc9d985e5c5ca02edee73999c9ac0e6.png#pic_center",[10,48,50],{"id":49},"show-me-the-code","show me the code",[52,53,58],"pre",{"className":54,"code":55,"language":56,"meta":57,"style":57},"language-html shiki shiki-themes github-light","\u003Cview class=\"all\">\n  \u003Cview class=\"head-title\" bindtap=\"clickHead\">\n    \u003Cview class=\"{{headOneTitle}}\">A\u003C\u002Fview>\n    \u003Cview class=\"{{headTwoTitle}}\">B\u003C\u002Fview>\n  \u003C\u002Fview>\n  \u003Cswiper current=\"{{ currentNum }}\" bindchange=\"swiperChanged\">\n    \u003Cswiper-item>\n      \u003Cscroll-view scroll-y=\"true\">\n        \u003Cview>A\u003C\u002Fview>\n        \u003Cview>A\u003C\u002Fview>\n      \u003C\u002Fscroll-view>\n    \u003C\u002Fswiper-item>\n\n    \u003Cswiper-item>\n      \u003Cscroll-view scroll-y=\"true\">\n        \u003Cview>B\u003C\u002Fview>\n        \u003Cview>B\u003C\u002Fview>\n      \u003C\u002Fscroll-view>\n    \u003C\u002Fswiper-item>\n  \u003C\u002Fswiper>\n\u003C\u002Fview>\n","html","",[59,60,61,88,113,135,156,166,192,203,222,236,249,259,269,276,285,300,313,326,335,344,353],"code",{"__ignoreMap":57},[62,63,66,70,74,78,81,85],"span",{"class":64,"line":65},"line",1,[62,67,69],{"class":68},"sgsFI","\u003C",[62,71,73],{"class":72},"sB1qb","view",[62,75,77],{"class":76},"s7eDp"," class",[62,79,80],{"class":68},"=",[62,82,84],{"class":83},"sYBdl","\"all\"",[62,86,87],{"class":68},">\n",[62,89,91,94,96,98,100,103,106,108,111],{"class":64,"line":90},2,[62,92,93],{"class":68},"  \u003C",[62,95,73],{"class":72},[62,97,77],{"class":76},[62,99,80],{"class":68},[62,101,102],{"class":83},"\"head-title\"",[62,104,105],{"class":76}," bindtap",[62,107,80],{"class":68},[62,109,110],{"class":83},"\"clickHead\"",[62,112,87],{"class":68},[62,114,116,119,121,123,125,128,131,133],{"class":64,"line":115},3,[62,117,118],{"class":68},"    \u003C",[62,120,73],{"class":72},[62,122,77],{"class":76},[62,124,80],{"class":68},[62,126,127],{"class":83},"\"{{headOneTitle}}\"",[62,129,130],{"class":68},">A\u003C\u002F",[62,132,73],{"class":72},[62,134,87],{"class":68},[62,136,138,140,142,144,146,149,152,154],{"class":64,"line":137},4,[62,139,118],{"class":68},[62,141,73],{"class":72},[62,143,77],{"class":76},[62,145,80],{"class":68},[62,147,148],{"class":83},"\"{{headTwoTitle}}\"",[62,150,151],{"class":68},">B\u003C\u002F",[62,153,73],{"class":72},[62,155,87],{"class":68},[62,157,159,162,164],{"class":64,"line":158},5,[62,160,161],{"class":68},"  \u003C\u002F",[62,163,73],{"class":72},[62,165,87],{"class":68},[62,167,169,171,174,177,179,182,185,187,190],{"class":64,"line":168},6,[62,170,93],{"class":68},[62,172,173],{"class":72},"swiper",[62,175,176],{"class":76}," current",[62,178,80],{"class":68},[62,180,181],{"class":83},"\"{{ currentNum }}\"",[62,183,184],{"class":76}," bindchange",[62,186,80],{"class":68},[62,188,189],{"class":83},"\"swiperChanged\"",[62,191,87],{"class":68},[62,193,195,197,201],{"class":64,"line":194},7,[62,196,118],{"class":68},[62,198,200],{"class":199},"shJU0","swiper-item",[62,202,87],{"class":68},[62,204,206,209,212,215,217,220],{"class":64,"line":205},8,[62,207,208],{"class":68},"      \u003C",[62,210,211],{"class":199},"scroll-view",[62,213,214],{"class":76}," scroll-y",[62,216,80],{"class":68},[62,218,219],{"class":83},"\"true\"",[62,221,87],{"class":68},[62,223,225,228,230,232,234],{"class":64,"line":224},9,[62,226,227],{"class":68},"        \u003C",[62,229,73],{"class":72},[62,231,130],{"class":68},[62,233,73],{"class":72},[62,235,87],{"class":68},[62,237,239,241,243,245,247],{"class":64,"line":238},10,[62,240,227],{"class":68},[62,242,73],{"class":72},[62,244,130],{"class":68},[62,246,73],{"class":72},[62,248,87],{"class":68},[62,250,252,255,257],{"class":64,"line":251},11,[62,253,254],{"class":68},"      \u003C\u002F",[62,256,211],{"class":199},[62,258,87],{"class":68},[62,260,262,265,267],{"class":64,"line":261},12,[62,263,264],{"class":68},"    \u003C\u002F",[62,266,200],{"class":199},[62,268,87],{"class":68},[62,270,272],{"class":64,"line":271},13,[62,273,275],{"emptyLinePlaceholder":274},true,"\n",[62,277,279,281,283],{"class":64,"line":278},14,[62,280,118],{"class":68},[62,282,200],{"class":199},[62,284,87],{"class":68},[62,286,288,290,292,294,296,298],{"class":64,"line":287},15,[62,289,208],{"class":68},[62,291,211],{"class":199},[62,293,214],{"class":76},[62,295,80],{"class":68},[62,297,219],{"class":83},[62,299,87],{"class":68},[62,301,303,305,307,309,311],{"class":64,"line":302},16,[62,304,227],{"class":68},[62,306,73],{"class":72},[62,308,151],{"class":68},[62,310,73],{"class":72},[62,312,87],{"class":68},[62,314,316,318,320,322,324],{"class":64,"line":315},17,[62,317,227],{"class":68},[62,319,73],{"class":72},[62,321,151],{"class":68},[62,323,73],{"class":72},[62,325,87],{"class":68},[62,327,329,331,333],{"class":64,"line":328},18,[62,330,254],{"class":68},[62,332,211],{"class":199},[62,334,87],{"class":68},[62,336,338,340,342],{"class":64,"line":337},19,[62,339,264],{"class":68},[62,341,200],{"class":199},[62,343,87],{"class":68},[62,345,347,349,351],{"class":64,"line":346},20,[62,348,161],{"class":68},[62,350,173],{"class":72},[62,352,87],{"class":68},[62,354,356,359,361],{"class":64,"line":355},21,[62,357,358],{"class":68},"\u003C\u002F",[62,360,73],{"class":72},[62,362,87],{"class":68},[52,364,368],{"className":365,"code":366,"language":367,"meta":57,"style":57},"language-css shiki shiki-themes github-light",".all {\n  height: 100vh;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n}\n\n.bigTitle {\n  color: #fff;\n  background-color: #07c160;\n}\n\n.head-title {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n  height: 100rpx;\n}\n\n.head-title view {\n  height: 100rpx;\n  line-height: 100rpx;\n  padding: 0 50rpx;\n}\n\nswiper {\n  \u002F* background-color: yellow; *\u002F\n  width: 100%;\n  flex: 1;\n}\n\nscroll-view {\n  background-color: red;\n  height: 100%;\n  width: 100%;\n}\n","css",[59,369,370,378,397,411,423,435,440,444,451,463,475,479,483,490,500,511,523,535,546,550,554,563,574,586,602,607,612,618,625,638,651,656,661,668,680,693,706],{"__ignoreMap":57},[62,371,372,375],{"class":64,"line":65},[62,373,374],{"class":76},".all",[62,376,377],{"class":68}," {\n",[62,379,380,384,387,390,394],{"class":64,"line":90},[62,381,383],{"class":382},"sYu0t","  height",[62,385,386],{"class":68},": ",[62,388,389],{"class":382},"100",[62,391,393],{"class":392},"sD7c4","vh",[62,395,396],{"class":68},";\n",[62,398,399,402,404,406,409],{"class":64,"line":115},[62,400,401],{"class":382},"  width",[62,403,386],{"class":68},[62,405,389],{"class":382},[62,407,408],{"class":392},"%",[62,410,396],{"class":68},[62,412,413,416,418,421],{"class":64,"line":137},[62,414,415],{"class":382},"  display",[62,417,386],{"class":68},[62,419,420],{"class":382},"flex",[62,422,396],{"class":68},[62,424,425,428,430,433],{"class":64,"line":158},[62,426,427],{"class":382},"  flex-direction",[62,429,386],{"class":68},[62,431,432],{"class":382},"column",[62,434,396],{"class":68},[62,436,437],{"class":64,"line":168},[62,438,439],{"class":68},"}\n",[62,441,442],{"class":64,"line":194},[62,443,275],{"emptyLinePlaceholder":274},[62,445,446,449],{"class":64,"line":205},[62,447,448],{"class":76},".bigTitle",[62,450,377],{"class":68},[62,452,453,456,458,461],{"class":64,"line":224},[62,454,455],{"class":382},"  color",[62,457,386],{"class":68},[62,459,460],{"class":382},"#fff",[62,462,396],{"class":68},[62,464,465,468,470,473],{"class":64,"line":238},[62,466,467],{"class":382},"  background-color",[62,469,386],{"class":68},[62,471,472],{"class":382},"#07c160",[62,474,396],{"class":68},[62,476,477],{"class":64,"line":251},[62,478,439],{"class":68},[62,480,481],{"class":64,"line":261},[62,482,275],{"emptyLinePlaceholder":274},[62,484,485,488],{"class":64,"line":271},[62,486,487],{"class":76},".head-title",[62,489,377],{"class":68},[62,491,492,494,496,498],{"class":64,"line":278},[62,493,415],{"class":382},[62,495,386],{"class":68},[62,497,420],{"class":382},[62,499,396],{"class":68},[62,501,502,504,506,509],{"class":64,"line":287},[62,503,427],{"class":382},[62,505,386],{"class":68},[62,507,508],{"class":382},"row",[62,510,396],{"class":68},[62,512,513,516,518,521],{"class":64,"line":302},[62,514,515],{"class":382},"  justify-content",[62,517,386],{"class":68},[62,519,520],{"class":382},"space-around",[62,522,396],{"class":68},[62,524,525,528,530,533],{"class":64,"line":315},[62,526,527],{"class":382},"  align-items",[62,529,386],{"class":68},[62,531,532],{"class":382},"center",[62,534,396],{"class":68},[62,536,537,539,541,543],{"class":64,"line":328},[62,538,383],{"class":382},[62,540,386],{"class":68},[62,542,389],{"class":382},[62,544,545],{"class":68},"rpx;\n",[62,547,548],{"class":64,"line":337},[62,549,439],{"class":68},[62,551,552],{"class":64,"line":346},[62,553,275],{"emptyLinePlaceholder":274},[62,555,556,558,561],{"class":64,"line":355},[62,557,487],{"class":76},[62,559,560],{"class":199}," view",[62,562,377],{"class":68},[62,564,566,568,570,572],{"class":64,"line":565},22,[62,567,383],{"class":382},[62,569,386],{"class":68},[62,571,389],{"class":382},[62,573,545],{"class":68},[62,575,577,580,582,584],{"class":64,"line":576},23,[62,578,579],{"class":382},"  line-height",[62,581,386],{"class":68},[62,583,389],{"class":382},[62,585,545],{"class":68},[62,587,589,592,594,597,600],{"class":64,"line":588},24,[62,590,591],{"class":382},"  padding",[62,593,386],{"class":68},[62,595,596],{"class":382},"0",[62,598,599],{"class":382}," 50",[62,601,545],{"class":68},[62,603,605],{"class":64,"line":604},25,[62,606,439],{"class":68},[62,608,610],{"class":64,"line":609},26,[62,611,275],{"emptyLinePlaceholder":274},[62,613,615],{"class":64,"line":614},27,[62,616,617],{"class":68},"swiper {\n",[62,619,621],{"class":64,"line":620},28,[62,622,624],{"class":623},"sAwPA","  \u002F* background-color: yellow; *\u002F\n",[62,626,628,630,632,634,636],{"class":64,"line":627},29,[62,629,401],{"class":382},[62,631,386],{"class":68},[62,633,389],{"class":382},[62,635,408],{"class":392},[62,637,396],{"class":68},[62,639,641,644,646,649],{"class":64,"line":640},30,[62,642,643],{"class":382},"  flex",[62,645,386],{"class":68},[62,647,648],{"class":382},"1",[62,650,396],{"class":68},[62,652,654],{"class":64,"line":653},31,[62,655,439],{"class":68},[62,657,659],{"class":64,"line":658},32,[62,660,275],{"emptyLinePlaceholder":274},[62,662,664,666],{"class":64,"line":663},33,[62,665,211],{"class":199},[62,667,377],{"class":68},[62,669,671,673,675,678],{"class":64,"line":670},34,[62,672,467],{"class":382},[62,674,386],{"class":68},[62,676,677],{"class":382},"red",[62,679,396],{"class":68},[62,681,683,685,687,689,691],{"class":64,"line":682},35,[62,684,383],{"class":382},[62,686,386],{"class":68},[62,688,389],{"class":382},[62,690,408],{"class":392},[62,692,396],{"class":68},[62,694,696,698,700,702,704],{"class":64,"line":695},36,[62,697,401],{"class":382},[62,699,386],{"class":68},[62,701,389],{"class":382},[62,703,408],{"class":392},[62,705,396],{"class":68},[62,707,709],{"class":64,"line":708},37,[62,710,439],{"class":68},[52,712,716],{"className":713,"code":714,"language":715,"meta":57,"style":57},"language-js shiki shiki-themes github-light","Page({\n  data: {\n    headOneTitle: \"bigTitle\",\n    headTwoTitle: \"\",\n    currentNum: 0,\n  },\n\n  \u002F\u002F 设置　head title style\n  setHeadTitle: function (a) {\n    console.log(a);\n\n    if (a) {\n      this.setData({\n        headOneTitle: \"\",\n        headTwoTitle: \"bigTitle\",\n      });\n    } else {\n      this.setData({\n        headOneTitle: \"bigTitle\",\n        headTwoTitle: \"\",\n      });\n    }\n  },\n\n  swiperChanged: function (e) {\n    let a = e.detail.current;\n    this.setHeadTitle(a);\n  },\n\n  clickHead: function () {\n    if (!this.data.headOneTitle) {\n      this.setData({\n        currentNum: 0,\n      });\n    } else {\n      this.setData({\n        currentNum: 1,\n      });\n    }\n  },\n});\n","js",[59,717,718,726,731,742,752,761,766,770,775,795,806,810,818,831,840,849,854,864,874,882,890,894,899,903,907,923,936,948,952,956,968,983,993,1002,1006,1014,1024,1032,1037,1042,1047],{"__ignoreMap":57},[62,719,720,723],{"class":64,"line":65},[62,721,722],{"class":76},"Page",[62,724,725],{"class":68},"({\n",[62,727,728],{"class":64,"line":90},[62,729,730],{"class":68},"  data: {\n",[62,732,733,736,739],{"class":64,"line":115},[62,734,735],{"class":68},"    headOneTitle: ",[62,737,738],{"class":83},"\"bigTitle\"",[62,740,741],{"class":68},",\n",[62,743,744,747,750],{"class":64,"line":137},[62,745,746],{"class":68},"    headTwoTitle: ",[62,748,749],{"class":83},"\"\"",[62,751,741],{"class":68},[62,753,754,757,759],{"class":64,"line":158},[62,755,756],{"class":68},"    currentNum: ",[62,758,596],{"class":382},[62,760,741],{"class":68},[62,762,763],{"class":64,"line":168},[62,764,765],{"class":68},"  },\n",[62,767,768],{"class":64,"line":194},[62,769,275],{"emptyLinePlaceholder":274},[62,771,772],{"class":64,"line":205},[62,773,774],{"class":623},"  \u002F\u002F 设置　head title style\n",[62,776,777,780,782,785,788,792],{"class":64,"line":224},[62,778,779],{"class":76},"  setHeadTitle",[62,781,386],{"class":68},[62,783,784],{"class":392},"function",[62,786,787],{"class":68}," (",[62,789,791],{"class":790},"sqxcx","a",[62,793,794],{"class":68},") {\n",[62,796,797,800,803],{"class":64,"line":238},[62,798,799],{"class":68},"    console.",[62,801,802],{"class":76},"log",[62,804,805],{"class":68},"(a);\n",[62,807,808],{"class":64,"line":251},[62,809,275],{"emptyLinePlaceholder":274},[62,811,812,815],{"class":64,"line":261},[62,813,814],{"class":392},"    if",[62,816,817],{"class":68}," (a) {\n",[62,819,820,823,826,829],{"class":64,"line":271},[62,821,822],{"class":382},"      this",[62,824,825],{"class":68},".",[62,827,828],{"class":76},"setData",[62,830,725],{"class":68},[62,832,833,836,838],{"class":64,"line":278},[62,834,835],{"class":68},"        headOneTitle: ",[62,837,749],{"class":83},[62,839,741],{"class":68},[62,841,842,845,847],{"class":64,"line":287},[62,843,844],{"class":68},"        headTwoTitle: ",[62,846,738],{"class":83},[62,848,741],{"class":68},[62,850,851],{"class":64,"line":302},[62,852,853],{"class":68},"      });\n",[62,855,856,859,862],{"class":64,"line":315},[62,857,858],{"class":68},"    } ",[62,860,861],{"class":392},"else",[62,863,377],{"class":68},[62,865,866,868,870,872],{"class":64,"line":328},[62,867,822],{"class":382},[62,869,825],{"class":68},[62,871,828],{"class":76},[62,873,725],{"class":68},[62,875,876,878,880],{"class":64,"line":337},[62,877,835],{"class":68},[62,879,738],{"class":83},[62,881,741],{"class":68},[62,883,884,886,888],{"class":64,"line":346},[62,885,844],{"class":68},[62,887,749],{"class":83},[62,889,741],{"class":68},[62,891,892],{"class":64,"line":355},[62,893,853],{"class":68},[62,895,896],{"class":64,"line":565},[62,897,898],{"class":68},"    }\n",[62,900,901],{"class":64,"line":576},[62,902,765],{"class":68},[62,904,905],{"class":64,"line":588},[62,906,275],{"emptyLinePlaceholder":274},[62,908,909,912,914,916,918,921],{"class":64,"line":604},[62,910,911],{"class":76},"  swiperChanged",[62,913,386],{"class":68},[62,915,784],{"class":392},[62,917,787],{"class":68},[62,919,920],{"class":790},"e",[62,922,794],{"class":68},[62,924,925,928,931,933],{"class":64,"line":609},[62,926,927],{"class":392},"    let",[62,929,930],{"class":68}," a ",[62,932,80],{"class":392},[62,934,935],{"class":68}," e.detail.current;\n",[62,937,938,941,943,946],{"class":64,"line":614},[62,939,940],{"class":382},"    this",[62,942,825],{"class":68},[62,944,945],{"class":76},"setHeadTitle",[62,947,805],{"class":68},[62,949,950],{"class":64,"line":620},[62,951,765],{"class":68},[62,953,954],{"class":64,"line":627},[62,955,275],{"emptyLinePlaceholder":274},[62,957,958,961,963,965],{"class":64,"line":640},[62,959,960],{"class":76},"  clickHead",[62,962,386],{"class":68},[62,964,784],{"class":392},[62,966,967],{"class":68}," () {\n",[62,969,970,972,974,977,980],{"class":64,"line":653},[62,971,814],{"class":392},[62,973,787],{"class":68},[62,975,976],{"class":392},"!",[62,978,979],{"class":382},"this",[62,981,982],{"class":68},".data.headOneTitle) {\n",[62,984,985,987,989,991],{"class":64,"line":658},[62,986,822],{"class":382},[62,988,825],{"class":68},[62,990,828],{"class":76},[62,992,725],{"class":68},[62,994,995,998,1000],{"class":64,"line":663},[62,996,997],{"class":68},"        currentNum: ",[62,999,596],{"class":382},[62,1001,741],{"class":68},[62,1003,1004],{"class":64,"line":670},[62,1005,853],{"class":68},[62,1007,1008,1010,1012],{"class":64,"line":682},[62,1009,858],{"class":68},[62,1011,861],{"class":392},[62,1013,377],{"class":68},[62,1015,1016,1018,1020,1022],{"class":64,"line":695},[62,1017,822],{"class":382},[62,1019,825],{"class":68},[62,1021,828],{"class":76},[62,1023,725],{"class":68},[62,1025,1026,1028,1030],{"class":64,"line":708},[62,1027,997],{"class":68},[62,1029,648],{"class":382},[62,1031,741],{"class":68},[62,1033,1035],{"class":64,"line":1034},38,[62,1036,853],{"class":68},[62,1038,1040],{"class":64,"line":1039},39,[62,1041,898],{"class":68},[62,1043,1045],{"class":64,"line":1044},40,[62,1046,765],{"class":68},[62,1048,1050],{"class":64,"line":1049},41,[62,1051,1052],{"class":68},"});\n",[10,1054,1055],{"id":1055},"用户体验上",[15,1057,1058,1061],{},[18,1059],{"alt":20,"src":1060},"https:\u002F\u002Fpub-5ec96507162a4f0a8e713a916117c9f4.r2.dev\u002Fblog\u002Fcfebc4b281e997786a01aa2b15d834f7.png",[18,1062],{"alt":20,"src":1063},"https:\u002F\u002Fpub-5ec96507162a4f0a8e713a916117c9f4.r2.dev\u002Fblog\u002F68b31601948e0f09abca3bce1190bd7a.png",[10,1065,1067,1068],{"id":1066},"我的个人网站-点击访问","我的个人网站 --> ",[791,1069,1073],{"href":1070,"rel":1071},"https:\u002F\u002Fhongweizhu.com",[1072],"nofollow","点击访问",[10,1075,1077],{"id":1076},"end","END",[10,1079,1081],{"id":1080},"写完这个博客发现-csdn-上早有分享","写完这个博客，发现 csdn 上早有分享",[10,1083,1085],{"id":1084},"_2021-02-21-改了一个三个的html-css-js-我就不分开了","2021-02-21 改了一个三个的（html css js 我就不分开了）",[52,1087,1092],{"className":1088,"code":1090,"language":1091},[1089],"language-text","\u003Cview class=\"all\">\n\n    \u003Cview class=\"head\" bindtap=\"onClickHead\">\n        \u003Cblock wx:for=\"{{ list }}\" wx:key=\"_id\">\n            \u003Cview class=\"{{ item.active ? 'green' : '' }}\" data-index=\"{{ item.id }}\">{{ item.title }}\u003C\u002Fview>\n        \u003C\u002Fblock>\n    \u003C\u002Fview>\n\n    \u003Cswiper current=\"{{ currentNum }}\" bindchange=\"swiperChanged\">\n        \u003Cswiper-item>\n            \u003Cscroll-view scroll-y=\"true\">\n                \u003Cview>A\u003C\u002Fview>\n                \u003Cview>A\u003C\u002Fview>\n\n            \u003C\u002Fscroll-view>\n        \u003C\u002Fswiper-item>\n\n        \u003Cswiper-item>\n            \u003Cscroll-view scroll-y=\"true\">\n                \u003Cview>B\u003C\u002Fview>\n                \u003Cview>B\u003C\u002Fview>\n\n            \u003C\u002Fscroll-view>\n        \u003C\u002Fswiper-item>\n\n        \u003Cswiper-item>\n            \u003Cscroll-view scroll-y=\"true\">\n                \u003Cview>C\u003C\u002Fview>\n                \u003Cview>C\u003C\u002Fview>\n\n            \u003C\u002Fscroll-view>\n        \u003C\u002Fswiper-item>\n\n        \u003C!-- \u003Cswiper-item>\n            \u003Cscroll-view scroll-y=\"true\">\n                \u003Cview>D\u003C\u002Fview>\n                \u003Cview>D\u003C\u002Fview>\n\n            \u003C\u002Fscroll-view>\n        \u003C\u002Fswiper-item> -->\n\n    \u003C\u002Fswiper>\n\u003C\u002Fview>\n\n\n\n\n\n\n\n\n\n\n.all {\n    height: 100vh;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n}\n\n.head {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-around;\n    align-items: center;\n    height: 100rpx;\n}\n\n.head view {\n    height: 100rpx;\n    line-height: 100rpx;\n    flex: 1;\n}\n\n.green {\n    background-color: #07c160 !important;\n}\n\nswiper {\n    \u002F* background-color: yellow; *\u002F\n    width: 100%;\n    flex: 1;\n}\n\nscroll-view {\n    background-color: red;\n    height: 100%;\n    width: 100%;\n}\n\n\n\n\n\n\n\n\n\n\nPage({\n    data: {\n        currentNum: 0,\n        list: [{\n            id: 0,\n            title: 'A',\n            active: true\n        },\n        {\n            id: 1,\n            title: 'B',\n            active: false\n        },\n        {\n            id: 2,\n            title: 'C',\n            active: false\n        },\n            \u002F\u002F {\n            \u002F\u002F  id: 3,\n            \u002F\u002F  title: 'D',\n            \u002F\u002F  active: false\n            \u002F\u002F },\n        ]\n    },\n\n        \u002F\u002F reSet head active style\n        reSetHeadActive: function () {\n            for (let i = 0; i \u003C this.data.list.length; i ++) {\n                \u002F\u002F console.log(this.data.list[i])\n                if ( this.data.list[i].active === true ) {\n                    let temp = \"list[\" + i + \"].active\"\n                    this.setData({\n                        [temp]: false\n                    })\n                }\n            }\n        },\n\n        \u002F\u002F set head active style\n        setHeadActive: function (a) {\n            console.log('change to', a)\n            this.reSetHeadActive()\n            let temp = \"list[\" + a + \"].active\"\n            this.setData({\n                [temp]: true\n            })\n        },\n\n        swiperChanged: function (e) {\n            let a = e.detail.current;\n            this.setHeadActive(a);\n        },\n\n    onClickHead: function (e) {\n        console.log('tap num', e.target.dataset.index)\n        this.setData({\n            currentNum: e.target.dataset.index\n        })\n    }\n})\n\n","text",[59,1093,1090],{"__ignoreMap":57},[10,1095,1097],{"id":1096},"上面的-3-个很容易变成-4-个-也就是把上面-wxml-js-中的注释打开顶多就-5-个吧","上面的 3 个很容易变成 4 个 (也就是把上面 wxml js 中的注释打开。顶多就 5 个吧)",[1099,1100,1101,1105],"ul",{},[1102,1103,1104],"li",{},"js list 数组中再加 添加一个对象 （类似注释）",[1102,1106,1107],{},"wxml 再加 swiper-item （类似注释）",[10,1109,1076],{"id":1110},"end-1",[1112,1113,1114],"style",{},"html pre.shiki code .sgsFI, html code.shiki .sgsFI{--shiki-default:#24292E}html pre.shiki code .sB1qb, html code.shiki .sB1qb{--shiki-default:#B31D28;--shiki-default-font-style:italic}html pre.shiki code .s7eDp, html code.shiki .s7eDp{--shiki-default:#6F42C1}html pre.shiki code .sYBdl, html code.shiki .sYBdl{--shiki-default:#032F62}html pre.shiki code .shJU0, html code.shiki .shJU0{--shiki-default:#22863A}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);}html pre.shiki code .sYu0t, html code.shiki .sYu0t{--shiki-default:#005CC5}html pre.shiki code .sD7c4, html code.shiki .sD7c4{--shiki-default:#D73A49}html pre.shiki code .sAwPA, html code.shiki .sAwPA{--shiki-default:#6A737D}html pre.shiki code .sqxcx, html code.shiki .sqxcx{--shiki-default:#E36209}",{"title":57,"searchDepth":90,"depth":90,"links":1116},[1117,1118,1119,1120,1121,1122,1124,1125,1126,1127,1128],{"id":12,"depth":90,"text":13},{"id":24,"depth":90,"text":25},{"id":41,"depth":90,"text":41},{"id":49,"depth":90,"text":50},{"id":1055,"depth":90,"text":1055},{"id":1066,"depth":90,"text":1123},"我的个人网站 --> 点击访问",{"id":1076,"depth":90,"text":1077},{"id":1080,"depth":90,"text":1081},{"id":1084,"depth":90,"text":1085},{"id":1096,"depth":90,"text":1097},{"id":1110,"depth":90,"text":1076},"前端",null,"2020-12-26",false,"md",{},"\u002Fblog\u002Fwechat_mini_program_swiper_plus_scroll_view_equals_what",{"title":5,"description":5},"blog\u002Fwechat_mini_program_swiper_plus_scroll_view_equals_what",[1139],"微信小程序","yuv2BRz7yaifOUkq4g4LzyfXeInd3UdPWyJw6UT8wQI",1782667391916]