mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-27 12:39:49 +08:00
1 line
12 KiB
JavaScript
1 line
12 KiB
JavaScript
(("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd=("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd||[]).push([["42937af8"],{"42937af8":function(a,e,d){"use strict";d.d(e,"__esModule",{value:!0}),d.d(e,"texts",{enumerable:!0,get:function(){return t;}}),d("efaf2729");let t=[{value:"\u5728 ",paraId:0},{value:"5.3.0",paraId:0},{value:" \u7248\u672C\u4E2D\uFF0C\u6211\u4EEC\u5C06\u4F1A\u66F4\u65B0 Tooltip \u7EC4\u4EF6\u7684\u5E95\u5C42\u4F9D\u8D56 ",paraId:0},{value:"@rc-component/trigger",paraId:0},{value:" \u4F7F\u5176\u66F4\u597D\u7684\u5B9E\u73B0\u81EA\u9002\u5E94\u5BF9\u9F50\u903B\u8F91\u3002\u5728\u6B64\u4E4B\u524D\uFF0C\u6211\u4EEC\u5148\u804A\u804A\u6B64\u524D\u7248\u672C\u9047\u5230\u7684\u4E00\u4E9B\u95EE\u9898\u3002",paraId:0},{value:"Tooltip \u9ED8\u8BA4\u6DFB\u52A0\u81F3 ",paraId:1,tocIndex:0},{value:"body",paraId:1,tocIndex:0},{value:" \u4E0A\uFF0C\u5728\u5168\u5C4F\u6EDA\u52A8\u65F6\u5B83\u4F1A\u968F\u7740\u4E00\u8D77\u6EDA\u52A8\u3002\u4F46\u662F\u5F53 Tooltip \u7684\u76EE\u6807\u5143\u7D20\u653E\u7F6E\u5728\u6EDA\u52A8\u5BB9\u5668\u4E2D\uFF0C\u5219\u56E0\u4E3A\u6EDA\u52A8\u5BB9\u5668\u4E0D\u540C\u800C\u51FA\u73B0\u4E0D\u4F1A\u8DDF\u968F\u6EDA\u52A8\u7684\u60C5\u51B5\uFF1A",paraId:1,tocIndex:0},{value:"\u6211\u4EEC\u96C6\u4E2D\u5728 FAQ \u63D0\u4F9B\u4E86 ",paraId:2,tocIndex:0},{value:"getPopupContainer",paraId:2,tocIndex:0},{value:" \u7684\u65B9\u5F0F\uFF0C\u8BA9\u5F00\u53D1\u8005\u5C06\u5F39\u51FA\u5143\u7D20\u901A\u8FC7\u8BE5\u65B9\u6CD5\u63D2\u5165\u5230\u76EE\u6807\u5143\u7D20\u7684\u7236\u7EA7\u5BB9\u5668\u4E2D\uFF0C\u4ECE\u800C\u89E3\u51B3\u8FD9\u4E2A\u95EE\u9898\u3002\u4F46\u662F\u8FD9\u4E2A\u65B9\u6848\u5E76\u4E0D\u5B8C\u7F8E\uFF0C\u56E0\u4E3A\u5B83\u9700\u8981\u5F00\u53D1\u8005\u81EA\u5DF1\u53BB\u5224\u65AD\u76EE\u6807\u5143\u7D20\u7684\u7236\u7EA7\u5BB9\u5668\u4E2D\u54EA\u4E2A\u662F\u6EDA\u52A8\u5BB9\u5668\u3002\u5728\u591A\u5C42\u5C01\u88C5\u7684\u7EC4\u4EF6\u4E2D\uFF0C\u53EF\u80FD\u4F7F\u7528 Tooltip \u7684\u7EC4\u4EF6\u4E0E\u5176\u6EDA\u52A8\u7684\u7EC4\u4EF6\u5E76\u4E0D\u662F\u540C\u4E00\u4E2A\uFF0C\u8FD9\u4F7F\u5F97\u8BBE\u7F6E\u76EE\u6807\u6EDA\u52A8\u5BB9\u5668\u5E76\u4E0D\u5BB9\u6613\u3002",paraId:2,tocIndex:0},{value:"Tooltip \u652F\u6301\u5728\u6EDA\u52A8\u8303\u56F4\u5185\u8D34\u8FB9\u5C55\u793A\u3002\u4F46\u662F\u7531\u4E8E\u5F39\u51FA\u5C42\u662F\u6574\u4F53\uFF0C\u4F7F\u5F97\u5C45\u4E2D\u7684\u7BAD\u5934\u5728\u504F\u79FB\u540E\u65E0\u6CD5\u6307\u5411\u76EE\u6807\u4F4D\u7F6E\uFF1A",paraId:3,tocIndex:1},{value:"\u6211\u4EEC\u4F1A\u63A8\u8350\u4F7F\u7528 ",paraId:4,tocIndex:1},{value:"placement",paraId:4,tocIndex:1},{value:" \u5C5E\u6027\uFF0C\u914D\u7F6E ",paraId:4,tocIndex:1},{value:"topLeft",paraId:4,tocIndex:1},{value:" \u8BA9\u5F39\u51FA\u5C42\u9760\u5DE6\u5BF9\u9F50\u6765\u89E3\u51B3\u8FD9\u4E2A\u95EE\u9898\uFF1A",paraId:4,tocIndex:1},{value:"\u540C\u6837\u7684\uFF0C\u5982\u679C\u662F\u590D\u7528\u7EC4\u4EF6\u3002\u53EF\u80FD\u5B83\u5E76\u4E0D\u662F\u603B\u662F\u9700\u8981\u8D34\u8FB9\u5C55\u793A\uFF0C\u5F53\u4E00\u4E2A\u5143\u7D20\u5728\u4E2D\u95F4\u5C55\u793A\u65F6\u5F39\u51FA\u5C42\u786E\u5B9E\u5DE6/\u53F3\u5BF9\u9F50\u5C31\u4F1A\u663E\u5F97\u975E\u5E38\u5947\u602A\u3002",paraId:5,tocIndex:1},{value:"Tooltip \u5BF9\u9F50\u5E95\u5C42\u4F7F\u7528 ",paraId:6,tocIndex:2},{value:"dom-align",paraId:6,tocIndex:2},{value:" \u5E93\uFF0C\u5B83\u4F1A\u76F4\u63A5\u4E3A DOM \u8282\u70B9\u6DFB\u52A0 ",paraId:6,tocIndex:2},{value:"left",paraId:6,tocIndex:2},{value:" | ",paraId:6,tocIndex:2},{value:"top",paraId:6,tocIndex:2},{value:" | ",paraId:6,tocIndex:2},{value:"transform",paraId:6,tocIndex:2},{value:" \u6837\u5F0F\u6765\u5B9E\u73B0\u5BF9\u9F50\uFF0C\u56E0\u800C\u4E3A\u4E86\u4F7F\u5176\u652F\u6301 React \u751F\u547D\u5468\u671F\uFF0C\u6211\u4EEC\u5728\u6B64\u4E4B\u4E0A\u5C01\u88C5\u4E86 ",paraId:6,tocIndex:2},{value:"rc-align",paraId:6,tocIndex:2},{value:" \u7EC4\u4EF6\u3002\u6B64\u5916\uFF0C\u5B83\u53EA\u5173\u6CE8\u5BF9\u9F50\u5B9E\u73B0\uFF0C\u672C\u8EAB\u4E0D\u5173\u6CE8\u89E6\u53D1\u65F6\u673A\u3002\u6240\u4EE5 ",paraId:6,tocIndex:2},{value:"rc-align",paraId:6,tocIndex:2},{value:" \u7EC4\u4EF6\u8FD8\u4F1A\u989D\u5916\u6DFB\u52A0 ResizeObserver \u76D1\u542C\u5C3A\u5BF8\u53D8\u5316\uFF0C\u7EE7\u800C\u8C03\u7528 ",paraId:6,tocIndex:2},{value:"dom-align",paraId:6,tocIndex:2},{value:" \u8FDB\u884C\u5BF9\u9F50\u3002",paraId:6,tocIndex:2},{value:"dom-align",paraId:7,tocIndex:2},{value:" \u901A\u8FC7\u904D\u5386\u7236\u5C42\u8282\u70B9\u7D2F\u52A0\u8BA1\u7B97\u51FA\u76EE\u6807\u5143\u7D20\u548C\u5F39\u51FA\u5C42\u5404\u81EA\u7684\u5750\u6807\u4F4D\u7F6E\uFF0C\u63A5\u7740\u6839\u636E\u5BF9\u9F50\u89C4\u5219\u8BA1\u7B97\u5DEE\u503C\u3002\u5F53\u7236\u5C42\u8282\u70B9\u6709 ",paraId:7,tocIndex:2},{value:"transform",paraId:7,tocIndex:2},{value:" \u6837\u5F0F\u65F6\uFF0C\u4F1A\u5BFC\u81F4\u8BA1\u7B97\u51FA\u7684\u5750\u6807\u4F4D\u7F6E\u4E0D\u51C6\u786E\uFF0C\u4ECE\u800C\u5BFC\u81F4\u5BF9\u9F50\u4E0D\u6B63\u786E\uFF1A",paraId:7,tocIndex:2},{value:"\u4EE5\u4E0A\u95EE\u9898\u5982\u6EDA\u52A8\u3001\u8D34\u8FB9\u53EF\u4EE5\u4F7F\u7528\u4E00\u4E9B\u65B9\u5F0F\u89C4\u907F\uFF0C\u800C\u7F29\u653E\u95EE\u9898\u5219\u65E0\u6CD5\u89E3\u51B3\u3002\u6211\u4EEC\u5E0C\u671B\u8FD9\u4E9B\u95EE\u9898\u53EF\u4EE5\u7531 antd \u5E95\u5C42\u6765\u89E3\uFF0C\u800C\u4E0D\u662F\u7531\u5F00\u53D1\u8005\u81EA\u5DF1\u53BB\u5904\u7406\u3002\u4E3A\u6B64\uFF0C\u6211\u4EEC\u91CD\u5199\u4E86 ",paraId:8,tocIndex:3},{value:"@rc-component/trigger",paraId:8,tocIndex:3},{value:" \u7EC4\u4EF6\uFF0C\u5C06\u5BF9\u9F50\u903B\u8F91\u548C\u7BAD\u5934\u903B\u8F91\u6574\u5408\u5728\u4E00\u8D77\u3002\u4E0D\u518D\u4F9D\u8D56 ",paraId:8,tocIndex:3},{value:"rc-align",paraId:8,tocIndex:3},{value:" \u4EE5\u53CA ",paraId:8,tocIndex:3},{value:"dom-align",paraId:8,tocIndex:3},{value:"\u3002\u540C\u65F6\u4F7F\u7528\u65B0\u7684\u8BA1\u7B97\u65B9\u5F0F\u907F\u514D ",paraId:8,tocIndex:3},{value:"transform",paraId:8,tocIndex:3},{value:" \u6837\u5F0F\u5BFC\u81F4\u7684\u8BA1\u7B97\u95EE\u9898\u3002",paraId:8,tocIndex:3},{value:"\u8003\u8651\u5230\u5F39\u51FA\u5143\u7D20\u7236\u5C42\u8282\u70B9\u5B58\u5728\u5404\u79CD ",paraId:9,tocIndex:4},{value:"position",paraId:9,tocIndex:4},{value:" \u7684\u60C5\u51B5\uFF0C\u9012\u5F52\u67E5\u627E\u7236\u5143\u7D20\u8282\u70B9\u8BA1\u7B97\u76F8\u5BF9\u4F4D\u7F6E\u5E76\u4E0D\u5212\u7B97\u3002\u6211\u4EEC\u53EA\u9700\u8981\u6839\u636E\u4E24\u8005\u6700\u7EC8\u4F4D\u7F6E\u505A\u504F\u79FB\u8BA1\u7B97\uFF0C\u518D\u5E94\u7528\u5F39\u51FA\u5C42\u6700\u7EC8\u7684\u7F29\u653E\u6BD4\u4F8B\u5373\u53EF\uFF1A",paraId:9,tocIndex:4},{value:"\u751F\u6210 Popup \u5143\u7D20",paraId:10,tocIndex:4},{value:"\u6DFB\u52A0 Popup \u6837\u5F0F ",paraId:10,tocIndex:4},{value:"left: 0",paraId:10,tocIndex:4},{value:" & ",paraId:10,tocIndex:4},{value:"top: 0",paraId:10,tocIndex:4},{value:"\uFF0C\u5C06\u5176\u5F3A\u5236\u5BF9\u9F50\u5230\u5DE6\u4E0A\u89D2\n",paraId:10,tocIndex:4},{value:"Popup \u5143\u7D20\u7236\u5BB9\u5668\u4E2D ",paraId:11,tocIndex:4},{value:"position",paraId:11,tocIndex:4},{value:" \u53EF\u80FD\u5B58\u5728 ",paraId:11,tocIndex:4},{value:"fixed",paraId:11,tocIndex:4},{value:"\u3001",paraId:11,tocIndex:4},{value:"relative",paraId:11,tocIndex:4},{value:"\u3001",paraId:11,tocIndex:4},{value:"absolute",paraId:11,tocIndex:4},{value:"\u8282\u70B9\uFF0C\u8FD9\u90FD\u4E0D\u5F71\u54CD\u6211\u4EEC\u8BA1\u7B97\u504F\u79FB\u91CF\u3002\u53EA\u8981\u4FDD\u8BC1\u5728 ",paraId:11,tocIndex:4},{value:"0/0",paraId:11,tocIndex:4},{value:" \u4F4D\u7F6E\u505A\u504F\u79FB\u5373\u53EF",paraId:11,tocIndex:4},{value:"\u901A\u8FC7 ",paraId:10,tocIndex:4},{value:"getBoundingClientRect",paraId:10,tocIndex:4},{value:" \u83B7\u53D6\u76EE\u6807\u5143\u7D20\u548C Popup \u5143\u7D20\u7684\u4F4D\u7F6E\u4FE1\u606F",paraId:10,tocIndex:4},{value:"\u8BA1\u7B97\u504F\u79FB\u5DEE\u503C",paraId:10,tocIndex:4},{value:"\u7F29\u653E\u6BD4\u4F8B\u65E0\u6CD5\u76F4\u63A5\u83B7\u53D6\uFF0C\u4F46\u662F\u6211\u4EEC\u53EF\u4EE5\u901A\u8FC7 ",paraId:12,tocIndex:5},{value:"getBoundingClientRect",paraId:12,tocIndex:5},{value:" \u4E0E ",paraId:12,tocIndex:5},{value:"offsetWidth",paraId:12,tocIndex:5},{value:"/",paraId:12,tocIndex:5},{value:"offsetHeight",paraId:12,tocIndex:5},{value:" \u8BA1\u7B97\u51FA\u7F29\u653E\u6BD4\u4F8B\uFF1A",paraId:12,tocIndex:5},{value:"const popupRect = popupEle.getBoundingClientRect();\nconst { offsetWidth, offsetHeight } = popupEle;\n\nconst scaleX = popupRect.width / offsetWidth;\nconst scaleY = popupRect.height / offsetHeight;\n",paraId:13,tocIndex:5},{value:"\u63A5\u7740\u5C06\u7F29\u653E\u6BD4\u4F8B\u5E94\u7528\u5230\u8BA1\u7B97\u51FA\u6765\u7684\u504F\u79FB\u503C\u5373\u53EF\uFF1A",paraId:14,tocIndex:5},{value:"// Some logic for align offset calculation\n// const baseOffsetX = ...\n// const baseOffsetY = ...\n\nconst scaledOffsetX = baseOffsetX / scaleX;\nconst scaledOffsetY = baseOffsetY / scaleY;\n",paraId:15,tocIndex:5},{value:"\u5728\u8FC7\u53BB\u7248\u672C\u4E2D\uFF0C\u7BAD\u5934\u7531 ",paraId:16,tocIndex:6},{value:"rc-tooltip",paraId:16,tocIndex:6},{value:" \u6DFB\u52A0\u800C\u975E ",paraId:16,tocIndex:6},{value:"rc-trigger",paraId:16,tocIndex:6},{value:" \u7BA1\u7406\u3002\u8FD9\u4F7F\u5F97 ",paraId:16,tocIndex:6},{value:"rc-tooltip",paraId:16,tocIndex:6},{value:" \u5C01\u88C5\u65F6\u5DF2\u7ECF\u4E22\u5931\u4E86\u5BF9\u9F50\u4FE1\u606F\uFF0C\u4EE5\u81F3\u4E8E\u65E0\u6CD5\u5728 Popup \u504F\u79FB\u65F6\u6B63\u786E\u7684\u8C03\u6574\u7BAD\u5934\u4F4D\u7F6E\u3002\u4E3A\u6B64\uFF0C\u6211\u4EEC\u5C06\u7BAD\u5934\u903B\u8F91\u4E5F\u6574\u5408\u5230 ",paraId:16,tocIndex:6},{value:"rc-trigger",paraId:16,tocIndex:6},{value:" \u4E2D\uFF0C\u4F7F\u5F97\u7BAD\u5934\u7684\u4F4D\u7F6E\u53EF\u4EE5\u968F\u7740 Popup \u7684\u504F\u79FB\u800C\u504F\u79FB\u3002\u5408\u5E76\u4E4B\u540E\uFF0C\u7BAD\u5934\u4F4D\u7F6E\u8BA1\u7B97\u53D8\u5F97\u5341\u5206\u7B80\u5355\u3002\u6211\u4EEC\u53EA\u8981\u53D6\u76EE\u6807\u5143\u7D20\u548C Popup \u8FB9\u754C\u503C\u6700\u5C0F\u503C\uFF0C\u518D\u53D6\u4E2D\u95F4\u503C\u5373\u53EF\uFF1A",paraId:16,tocIndex:6},{value:"\u65B0\u7684\u76D1\u542C\u6A21\u5F0F\u4F1A\u5728\u542F\u52A8 Tooltip \u65F6\u68C0\u6D4B Popup \u7236\u8282\u70B9 ",paraId:17,tocIndex:9},{value:"overflow",paraId:17,tocIndex:9},{value:" \u6837\u5F0F\uFF0C\u5F53\u5B58\u5728 ",paraId:17,tocIndex:9},{value:"scroll",paraId:17,tocIndex:9},{value:"\u3001",paraId:17,tocIndex:9},{value:"hidden",paraId:17,tocIndex:9},{value:"\u3001",paraId:17,tocIndex:9},{value:"auto",paraId:17,tocIndex:9},{value:" \u65F6\uFF0C\u53E0\u52A0\u9664\u6EDA\u52A8\u6761\u5916\u7684\u53EF\u89C1\u533A\u57DF\uFF0C\u4ECE\u800C\u8BA1\u7B97\u51FA\u6700\u7EC8\u7684\u663E\u793A\u533A\u57DF\uFF1A",paraId:17,tocIndex:9},{value:"\u540C\u6837\u7684\uFF0C\u6211\u4EEC\u9700\u8981\u76D1\u542C\u5176\u6EDA\u52A8\u4E8B\u4EF6\u3002\u4EFB\u610F\u7236\u5C42\u8282\u70B9\u6EDA\u52A8\u65F6\uFF0C\u90FD\u9700\u8981\u91CD\u65B0\u8BA1\u7B97\u663E\u793A\u533A\u57DF\uFF1A",paraId:18,tocIndex:9},{value:"function collectScroll(ele: HTMLElement) {\n const scrollList: HTMLElement[] = [];\n let current = ele?.parentElement;\n\n while (current) {\n if (isScrollContainer(current)) {\n scrollList.push(ele);\n }\n\n current = current.parentElement;\n }\n\n return scrollList;\n}\n\nconst targetScrollList = collectScroll(targetEle);\nconst popupScrollList = collectScroll(popupEle);\n\n// We merge the list in real world. Here just for sample\n[window, ...targetScrollList, ...popupScrollList].forEach((ele) => {\n ele.addEventListener(...);\n});\n",paraId:19,tocIndex:9},{value:"\u6700\u7EC8\uFF0C\u5C31\u5F97\u5230\u4E86\u53EF\u4EE5\u81EA\u9002\u5E94\u6EDA\u52A8\u7684\u6548\u679C\uFF1A",paraId:20,tocIndex:9},{value:"\u5728\u5B8C\u6210 Tooltip \u6539\u9020\u540E\uFF0C\u6211\u4EEC\u8FD8\u4F1A\u7EE7\u7EED\u6539\u9020\u5176\u4ED6\u4F7F\u7528\u5230\u5F39\u51FA\u5C42\u7684\u7EC4\u4EF6\u3002\u5E0C\u671B\u5728\u6B64\u4E4B\u540E\uFF0C\u5F00\u53D1\u8005\u53EF\u4EE5\u5C3D\u53EF\u80FD\u4E0D\u9700\u8981\u518D\u5173\u6CE8 ",paraId:21,tocIndex:10},{value:"getPopupContainer",paraId:21,tocIndex:10},{value:" \u7684\u914D\u7F6E\uFF0C\u800C\u662F\u53EF\u4EE5\u76F4\u63A5\u4F7F\u7528\u7EC4\u4EF6\u3002\u795D\u4F60\u5F00\u53D1\u6109\u5FEB\uFF01",paraId:21,tocIndex:10}];}}]); |