[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"knowledge-\u002Fapi\u002Fknowledge\u002Fteam-documents\u002F21":3,"knowledge-related-\u002Fknowledge\u002Fteam-documents\u002F21":2284,"knowledge-series-\u002Fknowledge\u002Fteam-documents\u002F21":2310},{"source":4,"connector":5,"page":6},"sqlite","better-sqlite3",{"path":7,"title":8,"description":9,"category":10,"tags":11,"date":15,"pinned":16,"draft":16,"body":17,"seo":2280,"stem":2281,"id":2282,"extension":2283},"\u002Fknowledge\u002Fteam-documents\u002F21","vxe-table 行 Hover 联动高亮","近期需求是双表格联动高亮：","团队文档",[12,13,14],"team","vue","table","2024-08-31",false,{"type":18,"value":19,"toc":2275},"minimark",[20,24,27,37,41,57,72,79,1897,1900,2247,2250,2272],[21,22,8],"h1",{"id":23},"vxe-table-行-hover-联动高亮",[25,26,9],"p",{},[28,29,30,34],"ul",{},[31,32,33],"li",{},"鼠标移入左侧表格某一行时，右侧对应行同步高亮；",[31,35,36],{},"鼠标移入右侧表格某一行时，左侧对应行也同步高亮。",[38,39,40],"h2",{"id":40},"实现思路",[25,42,43,44,48,49,52,53,56],{},"项目使用 ",[45,46,47],"code",{},"vxe-table","。在当前场景下，采用原生事件监听 ",[45,50,51],{},"tr"," 的 ",[45,54,55],{},"mouseenter\u002Fmouseleave"," 更直接可控：",[58,59,60,63,66,69],"ol",{},[31,61,62],{},"给目标表格行绑定移入\u002F移出事件；",[31,64,65],{},"在回调中拿到当前行索引；",[31,67,68],{},"根据映射关系找到另一侧需要联动的行索引；",[31,70,71],{},"对目标行批量设置\u002F清除高亮样式。",[25,73,74,75,78],{},"为避免重复绑定导致事件叠加，使用 ",[45,76,77],{},"WeakMap"," 保存并复用事件处理函数引用。",[80,81,86],"pre",{"className":82,"code":83,"language":84,"meta":85,"style":85},"language-ts shiki shiki-themes material-theme-lighter github-light github-dark","import { isArray, isFunction, isString } from \"lodash-es\";\n\ntype Tr = HTMLTableRowElement;\ntype TrList = NodeListOf\u003CTr>;\n\ntype EventType = \"mouseenter\" | \"mouseleave\";\n\ntype TrEventCallBack = (ops: Omit\u003CIItemTrFunCbParams, \"callback\">) => void;\ninterface ITrMouseEnterParams {\n  \u002F** 表格tr选择器 *\u002F\n  selector: string;\n  \u002F** 回调函数 *\u002F\n  callback?: TrEventCallBack;\n}\n\ninterface IItemTrFunCbParams {\n  \u002F** 鼠标事件对象或事件目标元素 *\u002F\n  row: MouseEvent | { target: Tr };\n  \u002F** 行索引 *\u002F\n  rowIndex: number;\n  \u002F** 事件类型 *\u002F\n  eventType: EventType;\n  \u002F** 回调函数 *\u002F\n  callback?: TrEventCallBack;\n}\n\ninterface IFindTableTrParams {\n  \u002F** 表格tr选择器 *\u002F\n  selector: string;\n  \u002F** 行索引数组 *\u002F\n  indexes: number[];\n  \u002F** 事件类型 *\u002F\n  eventType: EventType;\n}\n\n\u002F\u002F 使用 WeakMap 存储每个元素的事件处理函数引用\nconst eventHandlersMap = new WeakMap\u003C\n  Tr,\n  {\n    mouseenter: (e: MouseEvent) => void;\n    mouseleave: (e: MouseEvent) => void;\n  }\n>();\n\nclass HoverTableUtil {\n  static trColor = \"#ff880019\";\n\n  \u002F**\n   * 查找表格tr元素并绑定鼠标移入移出事件\n   * @param param0 查找表格tr参数\n   * @returns 无返回值\n   *\u002F\n  findTableTr({ selector, indexes, eventType }: IFindTableTrParams) {\n    if (!selector || !isString(selector)) return;\n    if (!isArray(indexes)) return;\n    for (let i = 0; i \u003C indexes.length; i++) {\n      const item = indexes[i];\n      const tr = document.querySelectorAll(selector)[item] as Tr;\n      if (!tr) continue;\n      HoverTableUtil.itemTrFunCb({\n        row: { target: tr },\n        rowIndex: i,\n        eventType,\n      });\n    }\n  }\n\n  \u002F**\n   * 表格 tr 鼠标事件回调函数\n   * @param param0 表格 tr 鼠标事件参数\n   * @returns 无返回值\n   *\u002F\n  static itemTrFunCb({ row, rowIndex, eventType, callback }: IItemTrFunCbParams) {\n    if (!row) return;\n    const target = row.target as Tr;\n    target.style.backgroundColor = eventType === \"mouseenter\" ? HoverTableUtil.trColor : \"\";\n    if (isFunction(callback)) callback({ row, rowIndex, eventType });\n  }\n\n  \u002F**\n   * 表格 tr 鼠标移入移出事件绑定\n   * @param param0 表格 tr 鼠标事件参数\n   * @returns 无返回值\n   *\u002F\n  trMouseEnter({ selector, callback }: ITrMouseEnterParams) {\n    if (!selector || !isString(selector)) return;\n    const trList: TrList = document.querySelectorAll(selector);\n    for (let i = 0; i \u003C trList.length; i++) {\n      const item = trList[i];\n      const existingHandlers = eventHandlersMap.get(item);\n      if (existingHandlers) {\n        item.removeEventListener(\"mouseenter\", existingHandlers.mouseenter);\n        item.removeEventListener(\"mouseleave\", existingHandlers.mouseleave);\n        eventHandlersMap.delete(item);\n      }\n      \u002F\u002F 创建新的事件处理函数\n      const mouseenterHandler = (row: MouseEvent) => {\n        HoverTableUtil.itemTrFunCb({\n          row,\n          rowIndex: i,\n          eventType: \"mouseenter\",\n          callback,\n        });\n      };\n      const mouseleaveHandler = (row: MouseEvent) => {\n        HoverTableUtil.itemTrFunCb({\n          row,\n          rowIndex: i,\n          eventType: \"mouseleave\",\n          callback,\n        });\n      };\n\n      \u002F\u002F 保存函数引用\n      eventHandlersMap.set(item, {\n        mouseenter: mouseenterHandler,\n        mouseleave: mouseleaveHandler,\n      });\n\n      \u002F\u002F 挂载事件\n      item.addEventListener(\"mouseenter\", mouseenterHandler);\n      item.addEventListener(\"mouseleave\", mouseleaveHandler);\n    }\n  }\n}\n\nexport const hoverTableUtil = new HoverTableUtil();\n","ts","",[45,87,88,136,143,163,185,190,219,224,273,285,292,306,312,325,331,336,346,352,377,383,396,402,414,419,430,435,440,450,455,466,472,487,492,503,508,513,519,540,549,555,581,605,611,622,627,638,658,663,669,675,695,708,714,747,785,808,857,881,919,938,953,972,984,992,1002,1008,1013,1018,1023,1029,1043,1054,1059,1096,1114,1138,1185,1224,1229,1234,1239,1245,1258,1269,1274,1298,1325,1353,1390,1409,1434,1448,1479,1508,1527,1533,1539,1564,1578,1586,1598,1614,1622,1632,1638,1662,1675,1682,1693,1708,1715,1724,1729,1734,1740,1759,1771,1783,1792,1797,1803,1830,1855,1860,1865,1870,1875],{"__ignoreMap":85},[89,90,93,97,101,105,108,111,113,116,119,122,126,130,133],"span",{"class":91,"line":92},"line",1,[89,94,96],{"class":95},"sVHd0","import",[89,98,100],{"class":99},"sP7_E"," {",[89,102,104],{"class":103},"su5hD"," isArray",[89,106,107],{"class":99},",",[89,109,110],{"class":103}," isFunction",[89,112,107],{"class":99},[89,114,115],{"class":103}," isString",[89,117,118],{"class":99}," }",[89,120,121],{"class":95}," from",[89,123,125],{"class":124},"sjJ54"," \"",[89,127,129],{"class":128},"s_sjI","lodash-es",[89,131,132],{"class":124},"\"",[89,134,135],{"class":99},";\n",[89,137,139],{"class":91,"line":138},2,[89,140,142],{"emptyLinePlaceholder":141},true,"\n",[89,144,146,150,154,158,161],{"class":91,"line":145},3,[89,147,149],{"class":148},"sbsja","type",[89,151,153],{"class":152},"sbgvK"," Tr",[89,155,157],{"class":156},"smGrS"," =",[89,159,160],{"class":152}," HTMLTableRowElement",[89,162,135],{"class":99},[89,164,166,168,171,173,176,179,182],{"class":91,"line":165},4,[89,167,149],{"class":148},[89,169,170],{"class":152}," TrList",[89,172,157],{"class":156},[89,174,175],{"class":152}," NodeListOf",[89,177,178],{"class":99},"\u003C",[89,180,181],{"class":152},"Tr",[89,183,184],{"class":99},">;\n",[89,186,188],{"class":91,"line":187},5,[89,189,142],{"emptyLinePlaceholder":141},[89,191,193,195,198,200,202,205,207,210,212,215,217],{"class":91,"line":192},6,[89,194,149],{"class":148},[89,196,197],{"class":152}," EventType",[89,199,157],{"class":156},[89,201,125],{"class":124},[89,203,204],{"class":128},"mouseenter",[89,206,132],{"class":124},[89,208,209],{"class":156}," |",[89,211,125],{"class":124},[89,213,214],{"class":128},"mouseleave",[89,216,132],{"class":124},[89,218,135],{"class":99},[89,220,222],{"class":91,"line":221},7,[89,223,142],{"emptyLinePlaceholder":141},[89,225,227,229,232,234,237,241,244,247,249,252,254,256,259,261,264,267,271],{"class":91,"line":226},8,[89,228,149],{"class":148},[89,230,231],{"class":152}," TrEventCallBack",[89,233,157],{"class":156},[89,235,236],{"class":99}," (",[89,238,240],{"class":239},"s99_P","ops",[89,242,243],{"class":156},":",[89,245,246],{"class":152}," Omit",[89,248,178],{"class":99},[89,250,251],{"class":152},"IItemTrFunCbParams",[89,253,107],{"class":99},[89,255,125],{"class":124},[89,257,258],{"class":128},"callback",[89,260,132],{"class":124},[89,262,263],{"class":99},">)",[89,265,266],{"class":148}," =>",[89,268,270],{"class":269},"sZMiF"," void",[89,272,135],{"class":99},[89,274,276,279,282],{"class":91,"line":275},9,[89,277,278],{"class":148},"interface",[89,280,281],{"class":152}," ITrMouseEnterParams",[89,283,284],{"class":99}," {\n",[89,286,288],{"class":91,"line":287},10,[89,289,291],{"class":290},"sutJx","  \u002F** 表格tr选择器 *\u002F\n",[89,293,295,299,301,304],{"class":91,"line":294},11,[89,296,298],{"class":297},"sucvu","  selector",[89,300,243],{"class":156},[89,302,303],{"class":269}," string",[89,305,135],{"class":99},[89,307,309],{"class":91,"line":308},12,[89,310,311],{"class":290},"  \u002F** 回调函数 *\u002F\n",[89,313,315,318,321,323],{"class":91,"line":314},13,[89,316,317],{"class":297},"  callback",[89,319,320],{"class":156},"?:",[89,322,231],{"class":152},[89,324,135],{"class":99},[89,326,328],{"class":91,"line":327},14,[89,329,330],{"class":99},"}\n",[89,332,334],{"class":91,"line":333},15,[89,335,142],{"emptyLinePlaceholder":141},[89,337,339,341,344],{"class":91,"line":338},16,[89,340,278],{"class":148},[89,342,343],{"class":152}," IItemTrFunCbParams",[89,345,284],{"class":99},[89,347,349],{"class":91,"line":348},17,[89,350,351],{"class":290},"  \u002F** 鼠标事件对象或事件目标元素 *\u002F\n",[89,353,355,358,360,363,365,367,370,372,374],{"class":91,"line":354},18,[89,356,357],{"class":297},"  row",[89,359,243],{"class":156},[89,361,362],{"class":152}," MouseEvent",[89,364,209],{"class":156},[89,366,100],{"class":99},[89,368,369],{"class":297}," target",[89,371,243],{"class":156},[89,373,153],{"class":152},[89,375,376],{"class":99}," };\n",[89,378,380],{"class":91,"line":379},19,[89,381,382],{"class":290},"  \u002F** 行索引 *\u002F\n",[89,384,386,389,391,394],{"class":91,"line":385},20,[89,387,388],{"class":297},"  rowIndex",[89,390,243],{"class":156},[89,392,393],{"class":269}," number",[89,395,135],{"class":99},[89,397,399],{"class":91,"line":398},21,[89,400,401],{"class":290},"  \u002F** 事件类型 *\u002F\n",[89,403,405,408,410,412],{"class":91,"line":404},22,[89,406,407],{"class":297},"  eventType",[89,409,243],{"class":156},[89,411,197],{"class":152},[89,413,135],{"class":99},[89,415,417],{"class":91,"line":416},23,[89,418,311],{"class":290},[89,420,422,424,426,428],{"class":91,"line":421},24,[89,423,317],{"class":297},[89,425,320],{"class":156},[89,427,231],{"class":152},[89,429,135],{"class":99},[89,431,433],{"class":91,"line":432},25,[89,434,330],{"class":99},[89,436,438],{"class":91,"line":437},26,[89,439,142],{"emptyLinePlaceholder":141},[89,441,443,445,448],{"class":91,"line":442},27,[89,444,278],{"class":148},[89,446,447],{"class":152}," IFindTableTrParams",[89,449,284],{"class":99},[89,451,453],{"class":91,"line":452},28,[89,454,291],{"class":290},[89,456,458,460,462,464],{"class":91,"line":457},29,[89,459,298],{"class":297},[89,461,243],{"class":156},[89,463,303],{"class":269},[89,465,135],{"class":99},[89,467,469],{"class":91,"line":468},30,[89,470,471],{"class":290},"  \u002F** 行索引数组 *\u002F\n",[89,473,475,478,480,482,485],{"class":91,"line":474},31,[89,476,477],{"class":297},"  indexes",[89,479,243],{"class":156},[89,481,393],{"class":269},[89,483,484],{"class":103},"[]",[89,486,135],{"class":99},[89,488,490],{"class":91,"line":489},32,[89,491,401],{"class":290},[89,493,495,497,499,501],{"class":91,"line":494},33,[89,496,407],{"class":297},[89,498,243],{"class":156},[89,500,197],{"class":152},[89,502,135],{"class":99},[89,504,506],{"class":91,"line":505},34,[89,507,330],{"class":99},[89,509,511],{"class":91,"line":510},35,[89,512,142],{"emptyLinePlaceholder":141},[89,514,516],{"class":91,"line":515},36,[89,517,518],{"class":290},"\u002F\u002F 使用 WeakMap 存储每个元素的事件处理函数引用\n",[89,520,522,525,529,531,534,537],{"class":91,"line":521},37,[89,523,524],{"class":148},"const",[89,526,528],{"class":527},"s_hVV"," eventHandlersMap",[89,530,157],{"class":156},[89,532,533],{"class":156}," new",[89,535,536],{"class":103}," WeakMap",[89,538,539],{"class":156},"\u003C\n",[89,541,543,546],{"class":91,"line":542},38,[89,544,545],{"class":103},"  Tr",[89,547,548],{"class":99},",\n",[89,550,552],{"class":91,"line":551},39,[89,553,554],{"class":99},"  {\n",[89,556,558,561,563,565,568,570,572,575,577,579],{"class":91,"line":557},40,[89,559,560],{"class":152},"    mouseenter",[89,562,243],{"class":99},[89,564,236],{"class":99},[89,566,567],{"class":239},"e",[89,569,243],{"class":156},[89,571,362],{"class":152},[89,573,574],{"class":99},")",[89,576,266],{"class":148},[89,578,270],{"class":156},[89,580,135],{"class":99},[89,582,584,587,589,591,593,595,597,599,601,603],{"class":91,"line":583},41,[89,585,586],{"class":152},"    mouseleave",[89,588,243],{"class":99},[89,590,236],{"class":99},[89,592,567],{"class":239},[89,594,243],{"class":156},[89,596,362],{"class":152},[89,598,574],{"class":99},[89,600,266],{"class":148},[89,602,270],{"class":156},[89,604,135],{"class":99},[89,606,608],{"class":91,"line":607},42,[89,609,610],{"class":99},"  }\n",[89,612,614,617,620],{"class":91,"line":613},43,[89,615,616],{"class":156},">",[89,618,619],{"class":103},"()",[89,621,135],{"class":99},[89,623,625],{"class":91,"line":624},44,[89,626,142],{"emptyLinePlaceholder":141},[89,628,630,633,636],{"class":91,"line":629},45,[89,631,632],{"class":148},"class",[89,634,635],{"class":152}," HoverTableUtil",[89,637,284],{"class":99},[89,639,641,644,647,649,651,654,656],{"class":91,"line":640},46,[89,642,643],{"class":148},"  static",[89,645,646],{"class":297}," trColor",[89,648,157],{"class":156},[89,650,125],{"class":124},[89,652,653],{"class":128},"#ff880019",[89,655,132],{"class":124},[89,657,135],{"class":99},[89,659,661],{"class":91,"line":660},47,[89,662,142],{"emptyLinePlaceholder":141},[89,664,666],{"class":91,"line":665},48,[89,667,668],{"class":290},"  \u002F**\n",[89,670,672],{"class":91,"line":671},49,[89,673,674],{"class":290},"   * 查找表格tr元素并绑定鼠标移入移出事件\n",[89,676,678,681,684,688,692],{"class":91,"line":677},50,[89,679,680],{"class":290},"   * ",[89,682,683],{"class":95},"@",[89,685,687],{"class":686},"sN_3T","param",[89,689,691],{"class":690},"sFwrP"," param0",[89,693,694],{"class":290}," 查找表格tr参数\n",[89,696,698,700,702,705],{"class":91,"line":697},51,[89,699,680],{"class":290},[89,701,683],{"class":95},[89,703,704],{"class":686},"returns",[89,706,707],{"class":290}," 无返回值\n",[89,709,711],{"class":91,"line":710},52,[89,712,713],{"class":290},"   *\u002F\n",[89,715,717,721,724,727,729,732,734,737,739,741,743,745],{"class":91,"line":716},53,[89,718,720],{"class":719},"sVXei","  findTableTr",[89,722,723],{"class":99},"({",[89,725,726],{"class":239}," selector",[89,728,107],{"class":99},[89,730,731],{"class":239}," indexes",[89,733,107],{"class":99},[89,735,736],{"class":239}," eventType",[89,738,118],{"class":99},[89,740,243],{"class":156},[89,742,447],{"class":152},[89,744,574],{"class":99},[89,746,284],{"class":99},[89,748,750,753,756,759,762,765,768,772,775,777,780,783],{"class":91,"line":749},54,[89,751,752],{"class":95},"    if",[89,754,236],{"class":755},"skxfh",[89,757,758],{"class":156},"!",[89,760,761],{"class":103},"selector",[89,763,764],{"class":156}," ||",[89,766,767],{"class":156}," !",[89,769,771],{"class":770},"sGLFI","isString",[89,773,774],{"class":755},"(",[89,776,761],{"class":103},[89,778,779],{"class":755},")) ",[89,781,782],{"class":95},"return",[89,784,135],{"class":99},[89,786,788,790,792,794,797,799,802,804,806],{"class":91,"line":787},55,[89,789,752],{"class":95},[89,791,236],{"class":755},[89,793,758],{"class":156},[89,795,796],{"class":770},"isArray",[89,798,774],{"class":755},[89,800,801],{"class":103},"indexes",[89,803,779],{"class":755},[89,805,782],{"class":95},[89,807,135],{"class":99},[89,809,811,814,816,819,822,824,828,831,833,836,838,841,844,846,848,851,854],{"class":91,"line":810},56,[89,812,813],{"class":95},"    for",[89,815,236],{"class":755},[89,817,818],{"class":148},"let",[89,820,821],{"class":103}," i",[89,823,157],{"class":156},[89,825,827],{"class":826},"srdBf"," 0",[89,829,830],{"class":99},";",[89,832,821],{"class":103},[89,834,835],{"class":156}," \u003C",[89,837,731],{"class":103},[89,839,840],{"class":99},".",[89,842,843],{"class":527},"length",[89,845,830],{"class":99},[89,847,821],{"class":103},[89,849,850],{"class":156},"++",[89,852,853],{"class":755},") ",[89,855,856],{"class":99},"{\n",[89,858,860,863,866,868,870,873,876,879],{"class":91,"line":859},57,[89,861,862],{"class":148},"      const",[89,864,865],{"class":527}," item",[89,867,157],{"class":156},[89,869,731],{"class":103},[89,871,872],{"class":755},"[",[89,874,875],{"class":103},"i",[89,877,878],{"class":755},"]",[89,880,135],{"class":99},[89,882,884,886,889,891,894,896,899,901,903,906,909,912,915,917],{"class":91,"line":883},58,[89,885,862],{"class":148},[89,887,888],{"class":527}," tr",[89,890,157],{"class":156},[89,892,893],{"class":103}," document",[89,895,840],{"class":99},[89,897,898],{"class":770},"querySelectorAll",[89,900,774],{"class":755},[89,902,761],{"class":103},[89,904,905],{"class":755},")[",[89,907,908],{"class":103},"item",[89,910,911],{"class":755},"] ",[89,913,914],{"class":95},"as",[89,916,153],{"class":152},[89,918,135],{"class":99},[89,920,922,925,927,929,931,933,936],{"class":91,"line":921},59,[89,923,924],{"class":95},"      if",[89,926,236],{"class":755},[89,928,758],{"class":156},[89,930,51],{"class":103},[89,932,853],{"class":755},[89,934,935],{"class":95},"continue",[89,937,135],{"class":99},[89,939,941,944,946,949,951],{"class":91,"line":940},60,[89,942,943],{"class":103},"      HoverTableUtil",[89,945,840],{"class":99},[89,947,948],{"class":770},"itemTrFunCb",[89,950,774],{"class":755},[89,952,856],{"class":99},[89,954,956,959,961,963,965,967,969],{"class":91,"line":955},61,[89,957,958],{"class":755},"        row",[89,960,243],{"class":99},[89,962,100],{"class":99},[89,964,369],{"class":755},[89,966,243],{"class":99},[89,968,888],{"class":103},[89,970,971],{"class":99}," },\n",[89,973,975,978,980,982],{"class":91,"line":974},62,[89,976,977],{"class":755},"        rowIndex",[89,979,243],{"class":99},[89,981,821],{"class":103},[89,983,548],{"class":99},[89,985,987,990],{"class":91,"line":986},63,[89,988,989],{"class":103},"        eventType",[89,991,548],{"class":99},[89,993,995,998,1000],{"class":91,"line":994},64,[89,996,997],{"class":99},"      }",[89,999,574],{"class":755},[89,1001,135],{"class":99},[89,1003,1005],{"class":91,"line":1004},65,[89,1006,1007],{"class":99},"    }\n",[89,1009,1011],{"class":91,"line":1010},66,[89,1012,610],{"class":99},[89,1014,1016],{"class":91,"line":1015},67,[89,1017,142],{"emptyLinePlaceholder":141},[89,1019,1021],{"class":91,"line":1020},68,[89,1022,668],{"class":290},[89,1024,1026],{"class":91,"line":1025},69,[89,1027,1028],{"class":290},"   * 表格 tr 鼠标事件回调函数\n",[89,1030,1032,1034,1036,1038,1040],{"class":91,"line":1031},70,[89,1033,680],{"class":290},[89,1035,683],{"class":95},[89,1037,687],{"class":686},[89,1039,691],{"class":690},[89,1041,1042],{"class":290}," 表格 tr 鼠标事件参数\n",[89,1044,1046,1048,1050,1052],{"class":91,"line":1045},71,[89,1047,680],{"class":290},[89,1049,683],{"class":95},[89,1051,704],{"class":686},[89,1053,707],{"class":290},[89,1055,1057],{"class":91,"line":1056},72,[89,1058,713],{"class":290},[89,1060,1062,1064,1067,1069,1072,1074,1077,1079,1081,1083,1086,1088,1090,1092,1094],{"class":91,"line":1061},73,[89,1063,643],{"class":148},[89,1065,1066],{"class":719}," itemTrFunCb",[89,1068,723],{"class":99},[89,1070,1071],{"class":239}," row",[89,1073,107],{"class":99},[89,1075,1076],{"class":239}," rowIndex",[89,1078,107],{"class":99},[89,1080,736],{"class":239},[89,1082,107],{"class":99},[89,1084,1085],{"class":239}," callback",[89,1087,118],{"class":99},[89,1089,243],{"class":156},[89,1091,343],{"class":152},[89,1093,574],{"class":99},[89,1095,284],{"class":99},[89,1097,1099,1101,1103,1105,1108,1110,1112],{"class":91,"line":1098},74,[89,1100,752],{"class":95},[89,1102,236],{"class":755},[89,1104,758],{"class":156},[89,1106,1107],{"class":103},"row",[89,1109,853],{"class":755},[89,1111,782],{"class":95},[89,1113,135],{"class":99},[89,1115,1117,1120,1122,1124,1126,1128,1131,1134,1136],{"class":91,"line":1116},75,[89,1118,1119],{"class":148},"    const",[89,1121,369],{"class":527},[89,1123,157],{"class":156},[89,1125,1071],{"class":103},[89,1127,840],{"class":99},[89,1129,1130],{"class":103},"target",[89,1132,1133],{"class":95}," as",[89,1135,153],{"class":152},[89,1137,135],{"class":99},[89,1139,1141,1144,1146,1149,1151,1154,1156,1158,1161,1163,1165,1167,1170,1172,1174,1177,1180,1183],{"class":91,"line":1140},76,[89,1142,1143],{"class":103},"    target",[89,1145,840],{"class":99},[89,1147,1148],{"class":103},"style",[89,1150,840],{"class":99},[89,1152,1153],{"class":103},"backgroundColor",[89,1155,157],{"class":156},[89,1157,736],{"class":103},[89,1159,1160],{"class":156}," ===",[89,1162,125],{"class":124},[89,1164,204],{"class":128},[89,1166,132],{"class":124},[89,1168,1169],{"class":156}," ?",[89,1171,635],{"class":103},[89,1173,840],{"class":99},[89,1175,1176],{"class":103},"trColor",[89,1178,1179],{"class":156}," :",[89,1181,1182],{"class":124}," \"\"",[89,1184,135],{"class":99},[89,1186,1188,1190,1192,1195,1197,1199,1201,1203,1205,1208,1210,1212,1214,1216,1218,1220,1222],{"class":91,"line":1187},77,[89,1189,752],{"class":95},[89,1191,236],{"class":755},[89,1193,1194],{"class":770},"isFunction",[89,1196,774],{"class":755},[89,1198,258],{"class":103},[89,1200,779],{"class":755},[89,1202,258],{"class":770},[89,1204,774],{"class":755},[89,1206,1207],{"class":99},"{",[89,1209,1071],{"class":103},[89,1211,107],{"class":99},[89,1213,1076],{"class":103},[89,1215,107],{"class":99},[89,1217,736],{"class":103},[89,1219,118],{"class":99},[89,1221,574],{"class":755},[89,1223,135],{"class":99},[89,1225,1227],{"class":91,"line":1226},78,[89,1228,610],{"class":99},[89,1230,1232],{"class":91,"line":1231},79,[89,1233,142],{"emptyLinePlaceholder":141},[89,1235,1237],{"class":91,"line":1236},80,[89,1238,668],{"class":290},[89,1240,1242],{"class":91,"line":1241},81,[89,1243,1244],{"class":290},"   * 表格 tr 鼠标移入移出事件绑定\n",[89,1246,1248,1250,1252,1254,1256],{"class":91,"line":1247},82,[89,1249,680],{"class":290},[89,1251,683],{"class":95},[89,1253,687],{"class":686},[89,1255,691],{"class":690},[89,1257,1042],{"class":290},[89,1259,1261,1263,1265,1267],{"class":91,"line":1260},83,[89,1262,680],{"class":290},[89,1264,683],{"class":95},[89,1266,704],{"class":686},[89,1268,707],{"class":290},[89,1270,1272],{"class":91,"line":1271},84,[89,1273,713],{"class":290},[89,1275,1277,1280,1282,1284,1286,1288,1290,1292,1294,1296],{"class":91,"line":1276},85,[89,1278,1279],{"class":719},"  trMouseEnter",[89,1281,723],{"class":99},[89,1283,726],{"class":239},[89,1285,107],{"class":99},[89,1287,1085],{"class":239},[89,1289,118],{"class":99},[89,1291,243],{"class":156},[89,1293,281],{"class":152},[89,1295,574],{"class":99},[89,1297,284],{"class":99},[89,1299,1301,1303,1305,1307,1309,1311,1313,1315,1317,1319,1321,1323],{"class":91,"line":1300},86,[89,1302,752],{"class":95},[89,1304,236],{"class":755},[89,1306,758],{"class":156},[89,1308,761],{"class":103},[89,1310,764],{"class":156},[89,1312,767],{"class":156},[89,1314,771],{"class":770},[89,1316,774],{"class":755},[89,1318,761],{"class":103},[89,1320,779],{"class":755},[89,1322,782],{"class":95},[89,1324,135],{"class":99},[89,1326,1328,1330,1333,1335,1337,1339,1341,1343,1345,1347,1349,1351],{"class":91,"line":1327},87,[89,1329,1119],{"class":148},[89,1331,1332],{"class":527}," trList",[89,1334,243],{"class":156},[89,1336,170],{"class":152},[89,1338,157],{"class":156},[89,1340,893],{"class":103},[89,1342,840],{"class":99},[89,1344,898],{"class":770},[89,1346,774],{"class":755},[89,1348,761],{"class":103},[89,1350,574],{"class":755},[89,1352,135],{"class":99},[89,1354,1356,1358,1360,1362,1364,1366,1368,1370,1372,1374,1376,1378,1380,1382,1384,1386,1388],{"class":91,"line":1355},88,[89,1357,813],{"class":95},[89,1359,236],{"class":755},[89,1361,818],{"class":148},[89,1363,821],{"class":103},[89,1365,157],{"class":156},[89,1367,827],{"class":826},[89,1369,830],{"class":99},[89,1371,821],{"class":103},[89,1373,835],{"class":156},[89,1375,1332],{"class":103},[89,1377,840],{"class":99},[89,1379,843],{"class":527},[89,1381,830],{"class":99},[89,1383,821],{"class":103},[89,1385,850],{"class":156},[89,1387,853],{"class":755},[89,1389,856],{"class":99},[89,1391,1393,1395,1397,1399,1401,1403,1405,1407],{"class":91,"line":1392},89,[89,1394,862],{"class":148},[89,1396,865],{"class":527},[89,1398,157],{"class":156},[89,1400,1332],{"class":103},[89,1402,872],{"class":755},[89,1404,875],{"class":103},[89,1406,878],{"class":755},[89,1408,135],{"class":99},[89,1410,1412,1414,1417,1419,1421,1423,1426,1428,1430,1432],{"class":91,"line":1411},90,[89,1413,862],{"class":148},[89,1415,1416],{"class":527}," existingHandlers",[89,1418,157],{"class":156},[89,1420,528],{"class":103},[89,1422,840],{"class":99},[89,1424,1425],{"class":770},"get",[89,1427,774],{"class":755},[89,1429,908],{"class":103},[89,1431,574],{"class":755},[89,1433,135],{"class":99},[89,1435,1437,1439,1441,1444,1446],{"class":91,"line":1436},91,[89,1438,924],{"class":95},[89,1440,236],{"class":755},[89,1442,1443],{"class":103},"existingHandlers",[89,1445,853],{"class":755},[89,1447,856],{"class":99},[89,1449,1451,1454,1456,1459,1461,1463,1465,1467,1469,1471,1473,1475,1477],{"class":91,"line":1450},92,[89,1452,1453],{"class":103},"        item",[89,1455,840],{"class":99},[89,1457,1458],{"class":770},"removeEventListener",[89,1460,774],{"class":755},[89,1462,132],{"class":124},[89,1464,204],{"class":128},[89,1466,132],{"class":124},[89,1468,107],{"class":99},[89,1470,1416],{"class":103},[89,1472,840],{"class":99},[89,1474,204],{"class":103},[89,1476,574],{"class":755},[89,1478,135],{"class":99},[89,1480,1482,1484,1486,1488,1490,1492,1494,1496,1498,1500,1502,1504,1506],{"class":91,"line":1481},93,[89,1483,1453],{"class":103},[89,1485,840],{"class":99},[89,1487,1458],{"class":770},[89,1489,774],{"class":755},[89,1491,132],{"class":124},[89,1493,214],{"class":128},[89,1495,132],{"class":124},[89,1497,107],{"class":99},[89,1499,1416],{"class":103},[89,1501,840],{"class":99},[89,1503,214],{"class":103},[89,1505,574],{"class":755},[89,1507,135],{"class":99},[89,1509,1511,1514,1516,1519,1521,1523,1525],{"class":91,"line":1510},94,[89,1512,1513],{"class":103},"        eventHandlersMap",[89,1515,840],{"class":99},[89,1517,1518],{"class":770},"delete",[89,1520,774],{"class":755},[89,1522,908],{"class":103},[89,1524,574],{"class":755},[89,1526,135],{"class":99},[89,1528,1530],{"class":91,"line":1529},95,[89,1531,1532],{"class":99},"      }\n",[89,1534,1536],{"class":91,"line":1535},96,[89,1537,1538],{"class":290},"      \u002F\u002F 创建新的事件处理函数\n",[89,1540,1542,1544,1548,1550,1552,1554,1556,1558,1560,1562],{"class":91,"line":1541},97,[89,1543,862],{"class":148},[89,1545,1547],{"class":1546},"sfCm-"," mouseenterHandler",[89,1549,157],{"class":156},[89,1551,236],{"class":99},[89,1553,1107],{"class":239},[89,1555,243],{"class":156},[89,1557,362],{"class":152},[89,1559,574],{"class":99},[89,1561,266],{"class":148},[89,1563,284],{"class":99},[89,1565,1567,1570,1572,1574,1576],{"class":91,"line":1566},98,[89,1568,1569],{"class":103},"        HoverTableUtil",[89,1571,840],{"class":99},[89,1573,948],{"class":770},[89,1575,774],{"class":755},[89,1577,856],{"class":99},[89,1579,1581,1584],{"class":91,"line":1580},99,[89,1582,1583],{"class":103},"          row",[89,1585,548],{"class":99},[89,1587,1589,1592,1594,1596],{"class":91,"line":1588},100,[89,1590,1591],{"class":755},"          rowIndex",[89,1593,243],{"class":99},[89,1595,821],{"class":103},[89,1597,548],{"class":99},[89,1599,1601,1604,1606,1608,1610,1612],{"class":91,"line":1600},101,[89,1602,1603],{"class":755},"          eventType",[89,1605,243],{"class":99},[89,1607,125],{"class":124},[89,1609,204],{"class":128},[89,1611,132],{"class":124},[89,1613,548],{"class":99},[89,1615,1617,1620],{"class":91,"line":1616},102,[89,1618,1619],{"class":103},"          callback",[89,1621,548],{"class":99},[89,1623,1625,1628,1630],{"class":91,"line":1624},103,[89,1626,1627],{"class":99},"        }",[89,1629,574],{"class":755},[89,1631,135],{"class":99},[89,1633,1635],{"class":91,"line":1634},104,[89,1636,1637],{"class":99},"      };\n",[89,1639,1641,1643,1646,1648,1650,1652,1654,1656,1658,1660],{"class":91,"line":1640},105,[89,1642,862],{"class":148},[89,1644,1645],{"class":1546}," mouseleaveHandler",[89,1647,157],{"class":156},[89,1649,236],{"class":99},[89,1651,1107],{"class":239},[89,1653,243],{"class":156},[89,1655,362],{"class":152},[89,1657,574],{"class":99},[89,1659,266],{"class":148},[89,1661,284],{"class":99},[89,1663,1665,1667,1669,1671,1673],{"class":91,"line":1664},106,[89,1666,1569],{"class":103},[89,1668,840],{"class":99},[89,1670,948],{"class":770},[89,1672,774],{"class":755},[89,1674,856],{"class":99},[89,1676,1678,1680],{"class":91,"line":1677},107,[89,1679,1583],{"class":103},[89,1681,548],{"class":99},[89,1683,1685,1687,1689,1691],{"class":91,"line":1684},108,[89,1686,1591],{"class":755},[89,1688,243],{"class":99},[89,1690,821],{"class":103},[89,1692,548],{"class":99},[89,1694,1696,1698,1700,1702,1704,1706],{"class":91,"line":1695},109,[89,1697,1603],{"class":755},[89,1699,243],{"class":99},[89,1701,125],{"class":124},[89,1703,214],{"class":128},[89,1705,132],{"class":124},[89,1707,548],{"class":99},[89,1709,1711,1713],{"class":91,"line":1710},110,[89,1712,1619],{"class":103},[89,1714,548],{"class":99},[89,1716,1718,1720,1722],{"class":91,"line":1717},111,[89,1719,1627],{"class":99},[89,1721,574],{"class":755},[89,1723,135],{"class":99},[89,1725,1727],{"class":91,"line":1726},112,[89,1728,1637],{"class":99},[89,1730,1732],{"class":91,"line":1731},113,[89,1733,142],{"emptyLinePlaceholder":141},[89,1735,1737],{"class":91,"line":1736},114,[89,1738,1739],{"class":290},"      \u002F\u002F 保存函数引用\n",[89,1741,1743,1746,1748,1751,1753,1755,1757],{"class":91,"line":1742},115,[89,1744,1745],{"class":103},"      eventHandlersMap",[89,1747,840],{"class":99},[89,1749,1750],{"class":770},"set",[89,1752,774],{"class":755},[89,1754,908],{"class":103},[89,1756,107],{"class":99},[89,1758,284],{"class":99},[89,1760,1762,1765,1767,1769],{"class":91,"line":1761},116,[89,1763,1764],{"class":755},"        mouseenter",[89,1766,243],{"class":99},[89,1768,1547],{"class":103},[89,1770,548],{"class":99},[89,1772,1774,1777,1779,1781],{"class":91,"line":1773},117,[89,1775,1776],{"class":755},"        mouseleave",[89,1778,243],{"class":99},[89,1780,1645],{"class":103},[89,1782,548],{"class":99},[89,1784,1786,1788,1790],{"class":91,"line":1785},118,[89,1787,997],{"class":99},[89,1789,574],{"class":755},[89,1791,135],{"class":99},[89,1793,1795],{"class":91,"line":1794},119,[89,1796,142],{"emptyLinePlaceholder":141},[89,1798,1800],{"class":91,"line":1799},120,[89,1801,1802],{"class":290},"      \u002F\u002F 挂载事件\n",[89,1804,1806,1809,1811,1814,1816,1818,1820,1822,1824,1826,1828],{"class":91,"line":1805},121,[89,1807,1808],{"class":103},"      item",[89,1810,840],{"class":99},[89,1812,1813],{"class":770},"addEventListener",[89,1815,774],{"class":755},[89,1817,132],{"class":124},[89,1819,204],{"class":128},[89,1821,132],{"class":124},[89,1823,107],{"class":99},[89,1825,1547],{"class":103},[89,1827,574],{"class":755},[89,1829,135],{"class":99},[89,1831,1833,1835,1837,1839,1841,1843,1845,1847,1849,1851,1853],{"class":91,"line":1832},122,[89,1834,1808],{"class":103},[89,1836,840],{"class":99},[89,1838,1813],{"class":770},[89,1840,774],{"class":755},[89,1842,132],{"class":124},[89,1844,214],{"class":128},[89,1846,132],{"class":124},[89,1848,107],{"class":99},[89,1850,1645],{"class":103},[89,1852,574],{"class":755},[89,1854,135],{"class":99},[89,1856,1858],{"class":91,"line":1857},123,[89,1859,1007],{"class":99},[89,1861,1863],{"class":91,"line":1862},124,[89,1864,610],{"class":99},[89,1866,1868],{"class":91,"line":1867},125,[89,1869,330],{"class":99},[89,1871,1873],{"class":91,"line":1872},126,[89,1874,142],{"emptyLinePlaceholder":141},[89,1876,1878,1881,1884,1887,1889,1891,1893,1895],{"class":91,"line":1877},127,[89,1879,1880],{"class":95},"export",[89,1882,1883],{"class":148}," const",[89,1885,1886],{"class":527}," hoverTableUtil",[89,1888,157],{"class":156},[89,1890,533],{"class":156},[89,1892,635],{"class":770},[89,1894,619],{"class":103},[89,1896,135],{"class":99},[38,1898,1899],{"id":1899},"使用示例",[80,1901,1903],{"className":82,"code":1902,"language":84,"meta":85,"style":85},"\u002F\u002F 使用demo\n\nwatch(\n  () => data1.value,\n  (val) => {\n    hoverTableUtil.trMouseEnter({\n      selector: \".left-table table tbody tr\",\n      callback: ({ rowIndex, eventType }) => {\n        hoverTableUtil.findTableTr({\n          selector: \".right-table table tbody tr\",\n          indexes: [], \u002F\u002F 高亮的索引合集\n          eventType,\n        });\n      },\n    });\n  },\n);\n\nwatch(\n  () => data2.value,\n  (val) => {\n    hoverTableUtil.trMouseEnter({\n      selector: \".right-table table tbody tr\",\n      callback: ({ rowIndex, eventType }) => {\n        hoverTableUtil.findTableTr({\n          selector: \".left-table table tbody tr\",\n          indexes: [], \u002F\u002F 高亮的索引合集\n          eventType,\n        });\n      },\n    });\n  },\n);\n",[45,1904,1905,1910,1914,1922,1939,1953,1967,1983,2006,2020,2036,2051,2057,2065,2070,2079,2084,2090,2094,2100,2115,2127,2139,2153,2173,2185,2199,2211,2217,2225,2229,2237,2241],{"__ignoreMap":85},[89,1906,1907],{"class":91,"line":92},[89,1908,1909],{"class":290},"\u002F\u002F 使用demo\n",[89,1911,1912],{"class":91,"line":138},[89,1913,142],{"emptyLinePlaceholder":141},[89,1915,1916,1919],{"class":91,"line":145},[89,1917,1918],{"class":770},"watch",[89,1920,1921],{"class":103},"(\n",[89,1923,1924,1927,1929,1932,1934,1937],{"class":91,"line":165},[89,1925,1926],{"class":99},"  ()",[89,1928,266],{"class":148},[89,1930,1931],{"class":103}," data1",[89,1933,840],{"class":99},[89,1935,1936],{"class":103},"value",[89,1938,548],{"class":99},[89,1940,1941,1944,1947,1949,1951],{"class":91,"line":187},[89,1942,1943],{"class":99},"  (",[89,1945,1946],{"class":239},"val",[89,1948,574],{"class":99},[89,1950,266],{"class":148},[89,1952,284],{"class":99},[89,1954,1955,1958,1960,1963,1965],{"class":91,"line":192},[89,1956,1957],{"class":103},"    hoverTableUtil",[89,1959,840],{"class":99},[89,1961,1962],{"class":770},"trMouseEnter",[89,1964,774],{"class":755},[89,1966,856],{"class":99},[89,1968,1969,1972,1974,1976,1979,1981],{"class":91,"line":221},[89,1970,1971],{"class":755},"      selector",[89,1973,243],{"class":99},[89,1975,125],{"class":124},[89,1977,1978],{"class":128},".left-table table tbody tr",[89,1980,132],{"class":124},[89,1982,548],{"class":99},[89,1984,1985,1988,1990,1993,1995,1997,1999,2002,2004],{"class":91,"line":226},[89,1986,1987],{"class":770},"      callback",[89,1989,243],{"class":99},[89,1991,1992],{"class":99}," ({",[89,1994,1076],{"class":239},[89,1996,107],{"class":99},[89,1998,736],{"class":239},[89,2000,2001],{"class":99}," })",[89,2003,266],{"class":148},[89,2005,284],{"class":99},[89,2007,2008,2011,2013,2016,2018],{"class":91,"line":275},[89,2009,2010],{"class":103},"        hoverTableUtil",[89,2012,840],{"class":99},[89,2014,2015],{"class":770},"findTableTr",[89,2017,774],{"class":755},[89,2019,856],{"class":99},[89,2021,2022,2025,2027,2029,2032,2034],{"class":91,"line":287},[89,2023,2024],{"class":755},"          selector",[89,2026,243],{"class":99},[89,2028,125],{"class":124},[89,2030,2031],{"class":128},".right-table table tbody tr",[89,2033,132],{"class":124},[89,2035,548],{"class":99},[89,2037,2038,2041,2043,2046,2048],{"class":91,"line":294},[89,2039,2040],{"class":755},"          indexes",[89,2042,243],{"class":99},[89,2044,2045],{"class":755}," []",[89,2047,107],{"class":99},[89,2049,2050],{"class":290}," \u002F\u002F 高亮的索引合集\n",[89,2052,2053,2055],{"class":91,"line":308},[89,2054,1603],{"class":103},[89,2056,548],{"class":99},[89,2058,2059,2061,2063],{"class":91,"line":314},[89,2060,1627],{"class":99},[89,2062,574],{"class":755},[89,2064,135],{"class":99},[89,2066,2067],{"class":91,"line":327},[89,2068,2069],{"class":99},"      },\n",[89,2071,2072,2075,2077],{"class":91,"line":333},[89,2073,2074],{"class":99},"    }",[89,2076,574],{"class":755},[89,2078,135],{"class":99},[89,2080,2081],{"class":91,"line":338},[89,2082,2083],{"class":99},"  },\n",[89,2085,2086,2088],{"class":91,"line":348},[89,2087,574],{"class":103},[89,2089,135],{"class":99},[89,2091,2092],{"class":91,"line":354},[89,2093,142],{"emptyLinePlaceholder":141},[89,2095,2096,2098],{"class":91,"line":379},[89,2097,1918],{"class":770},[89,2099,1921],{"class":103},[89,2101,2102,2104,2106,2109,2111,2113],{"class":91,"line":385},[89,2103,1926],{"class":99},[89,2105,266],{"class":148},[89,2107,2108],{"class":103}," data2",[89,2110,840],{"class":99},[89,2112,1936],{"class":103},[89,2114,548],{"class":99},[89,2116,2117,2119,2121,2123,2125],{"class":91,"line":398},[89,2118,1943],{"class":99},[89,2120,1946],{"class":239},[89,2122,574],{"class":99},[89,2124,266],{"class":148},[89,2126,284],{"class":99},[89,2128,2129,2131,2133,2135,2137],{"class":91,"line":404},[89,2130,1957],{"class":103},[89,2132,840],{"class":99},[89,2134,1962],{"class":770},[89,2136,774],{"class":755},[89,2138,856],{"class":99},[89,2140,2141,2143,2145,2147,2149,2151],{"class":91,"line":416},[89,2142,1971],{"class":755},[89,2144,243],{"class":99},[89,2146,125],{"class":124},[89,2148,2031],{"class":128},[89,2150,132],{"class":124},[89,2152,548],{"class":99},[89,2154,2155,2157,2159,2161,2163,2165,2167,2169,2171],{"class":91,"line":421},[89,2156,1987],{"class":770},[89,2158,243],{"class":99},[89,2160,1992],{"class":99},[89,2162,1076],{"class":239},[89,2164,107],{"class":99},[89,2166,736],{"class":239},[89,2168,2001],{"class":99},[89,2170,266],{"class":148},[89,2172,284],{"class":99},[89,2174,2175,2177,2179,2181,2183],{"class":91,"line":432},[89,2176,2010],{"class":103},[89,2178,840],{"class":99},[89,2180,2015],{"class":770},[89,2182,774],{"class":755},[89,2184,856],{"class":99},[89,2186,2187,2189,2191,2193,2195,2197],{"class":91,"line":437},[89,2188,2024],{"class":755},[89,2190,243],{"class":99},[89,2192,125],{"class":124},[89,2194,1978],{"class":128},[89,2196,132],{"class":124},[89,2198,548],{"class":99},[89,2200,2201,2203,2205,2207,2209],{"class":91,"line":442},[89,2202,2040],{"class":755},[89,2204,243],{"class":99},[89,2206,2045],{"class":755},[89,2208,107],{"class":99},[89,2210,2050],{"class":290},[89,2212,2213,2215],{"class":91,"line":452},[89,2214,1603],{"class":103},[89,2216,548],{"class":99},[89,2218,2219,2221,2223],{"class":91,"line":457},[89,2220,1627],{"class":99},[89,2222,574],{"class":755},[89,2224,135],{"class":99},[89,2226,2227],{"class":91,"line":468},[89,2228,2069],{"class":99},[89,2230,2231,2233,2235],{"class":91,"line":474},[89,2232,2074],{"class":99},[89,2234,574],{"class":755},[89,2236,135],{"class":99},[89,2238,2239],{"class":91,"line":489},[89,2240,2083],{"class":99},[89,2242,2243,2245],{"class":91,"line":494},[89,2244,574],{"class":103},[89,2246,135],{"class":99},[38,2248,2249],{"id":2249},"注意事项",[58,2251,2252,2261,2266],{},[31,2253,2254,2256,2257,2260],{},[45,2255,1918],{}," 重新触发时会重复绑定事件，已通过 ",[45,2258,2259],{},"WeakMap + removeEventListener"," 做清理。",[31,2262,2263,2265],{},[45,2264,801],{}," 建议由业务层提前计算好（如主键映射），避免在 hover 回调里做重计算。",[31,2267,2268,2269,2271],{},"高亮样式建议统一为 class 控制，复杂场景可替换直接写 ",[45,2270,1148],{}," 的方式。",[1148,2273,2274],{},"html pre.shiki code .sVHd0, html code.shiki .sVHd0{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#D73A49;--shiki-default-font-style:inherit;--shiki-dark:#F97583;--shiki-dark-font-style:inherit}html pre.shiki code .sP7_E, html code.shiki .sP7_E{--shiki-light:#39ADB5;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .su5hD, html code.shiki .su5hD{--shiki-light:#90A4AE;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sjJ54, html code.shiki .sjJ54{--shiki-light:#39ADB5;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .s_sjI, html code.shiki .s_sjI{--shiki-light:#91B859;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sbsja, html code.shiki .sbsja{--shiki-light:#9C3EDA;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sbgvK, html code.shiki .sbgvK{--shiki-light:#E2931D;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .smGrS, html code.shiki .smGrS{--shiki-light:#39ADB5;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .s99_P, html code.shiki .s99_P{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#E36209;--shiki-default-font-style:inherit;--shiki-dark:#FFAB70;--shiki-dark-font-style:inherit}html pre.shiki code .sZMiF, html code.shiki .sZMiF{--shiki-light:#E2931D;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sutJx, html code.shiki .sutJx{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#6A737D;--shiki-default-font-style:inherit;--shiki-dark:#6A737D;--shiki-dark-font-style:inherit}html pre.shiki code .sucvu, html code.shiki .sucvu{--shiki-light:#E53935;--shiki-default:#E36209;--shiki-dark:#FFAB70}html pre.shiki code .s_hVV, html code.shiki .s_hVV{--shiki-light:#90A4AE;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sN_3T, html code.shiki .sN_3T{--shiki-light:#9C3EDA;--shiki-light-font-style:italic;--shiki-default:#D73A49;--shiki-default-font-style:inherit;--shiki-dark:#F97583;--shiki-dark-font-style:inherit}html pre.shiki code .sFwrP, html code.shiki .sFwrP{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#24292E;--shiki-default-font-style:inherit;--shiki-dark:#E1E4E8;--shiki-dark-font-style:inherit}html pre.shiki code .sVXei, html code.shiki .sVXei{--shiki-light:#E53935;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .skxfh, html code.shiki .skxfh{--shiki-light:#E53935;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sGLFI, html code.shiki .sGLFI{--shiki-light:#6182B8;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .srdBf, html code.shiki .srdBf{--shiki-light:#F76D47;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sfCm-, html code.shiki .sfCm-{--shiki-light:#90A4AE;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}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 .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":85,"searchDepth":138,"depth":138,"links":2276},[2277,2278,2279],{"id":40,"depth":138,"text":40},{"id":1899,"depth":138,"text":1899},{"id":2249,"depth":138,"text":2249},{"title":8,"description":9},"knowledge\u002Fteam-documents\u002F21","knowledge\u002Fknowledge\u002Fteam-documents\u002F21.md","md",{"items":2285},[2286,2290,2294,2298,2302,2306],{"path":2287,"title":2288,"description":2289,"category":10,"score":308},"\u002Fknowledge\u002Fteam-documents\u002F19","GridView 宫格加载渲染优化","系统首页 GridView 宫格模块接口耗时不高，但首次进入总耗时接近 22s。复盘耗时分层定位过程、代码层面的瓶颈（约 2000 行、100 个 tab 重复节点）、优化手段与最终指标对比。",{"path":2291,"title":2292,"description":2293,"category":10,"score":308},"\u002Fknowledge\u002Fteam-documents\u002F01","执行价格弹窗：表头 \u002F 表体合并与可配置表格","业务需要在「执行价格」类弹窗中展示多块价格配置（基础、颜色、规格、行业等）。每块区域具备：",{"path":2295,"title":2296,"description":2297,"category":10,"score":308},"\u002Fknowledge\u002Fteam-documents\u002F05","内部插件 \u002F 工具库开发实践","在企业前端项目中，utils、hooks、libs 这类通用能力通常分散在多个仓库，常见问题包括：",{"path":2299,"title":2300,"description":2301,"category":10,"score":275},"\u002Fknowledge\u002Fteam-documents\u002F13","新商家系统性能优化实践","商家系统新版本上线后，团队持续针对构建效率与用户体验做了一轮系统性优化。本文记录核心方案与落地结果，供后续版本复用。",{"path":2303,"title":2304,"description":2305,"category":10,"score":275},"\u002Fknowledge\u002Fteam-documents\u002F04","老系统升级与兼容改造实践","公司原有业务系统采用 Node + jQuery 架构，长期运行后暴露出典型遗留系统问题：",{"path":2307,"title":2308,"description":2309,"category":10,"score":275},"\u002Fknowledge\u002Fteam-documents\u002F03","键盘弹起导致底部被顶起问题（H5 适配）","在移动端 H5 页面中，当用户聚焦 input、textarea 等可编辑元素、软键盘弹出时，常见表现包括：",{"series":2311,"title":2312,"items":2313,"index":385,"prev":2387,"next":2388},"team-documents","team documents",[2314,2316,2320,2322,2324,2326,2330,2334,2338,2342,2346,2350,2354,2356,2360,2364,2368,2372,2376,2378,2382,2383],{"path":2291,"title":2292,"date":2315,"pinned":16},"2024-07-27",{"path":2317,"title":2318,"date":2319,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F02","防篡改水印","2024-01-09",{"path":2307,"title":2308,"date":2321,"pinned":16},"2024-09-17",{"path":2303,"title":2304,"date":2323,"pinned":16},"2024-12-12",{"path":2295,"title":2296,"date":2325,"pinned":16},"2021-08-19",{"path":2327,"title":2328,"date":2329,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F06","企业微信与小程序工单问题","2025-10-01",{"path":2331,"title":2332,"date":2333,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F07","企业微信群工具打开缓慢原因分析","2020-04-12",{"path":2335,"title":2336,"date":2337,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F08","属性排序需求","2024-06-16",{"path":2339,"title":2340,"date":2341,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F09","同业主重复单提醒规则","2020-06-07",{"path":2343,"title":2344,"date":2345,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F10","图片上传前的自定义水印实践","2021-06-10",{"path":2347,"title":2348,"date":2349,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F11","系统下单（重复单提示框）异常复盘","2023-11-21",{"path":2351,"title":2352,"date":2353,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F12","系统自动更新说明","2025-05-26",{"path":2299,"title":2300,"date":2355,"pinned":16},"2025-04-08",{"path":2357,"title":2358,"date":2359,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F14","选项卡切换与 Loading 状态封装","2019-11-03",{"path":2361,"title":2362,"date":2363,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F15","移动端返回事件触发两次问题复盘","2021-03-09",{"path":2365,"title":2366,"date":2367,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F16","在线协作表格接入实践","2023-10-27",{"path":2369,"title":2370,"date":2371,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F17","支付中转页面升级实践","2022-10-15",{"path":2373,"title":2374,"date":2375,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F18","中英文输入法下搜索触发冲突复盘","2024-09-01",{"path":2287,"title":2288,"date":2377,"pinned":16},"2026-03-17",{"path":2379,"title":2380,"date":2381,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F20","H5 GPS 定位问题说明","2023-08-31",{"path":7,"title":8,"date":15,"pinned":16},{"path":2384,"title":2385,"date":2386,"pinned":16},"\u002Fknowledge\u002Fteam-documents\u002F22","企业微信 uni-app H5：OAuth 回退白屏与列表缓存","2023-08-17",{"path":2379,"title":2380,"date":2381,"pinned":16},{"path":2384,"title":2385,"date":2386,"pinned":16}]