mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-20 10:01:17 +08:00
7da2f1fb8d
* Add FAQ entry for Toolkit + custom component * Add tooltip example for custom component * Add link to example in Tooltip doc page * Add link to issue Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Replace custom props with HTMLSpanElement props Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Import handlers as types Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Fix formatting Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Update components/tooltip/demo/wrap-custom-component.tsx Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Update components/tooltip/index.en-US.md Co-authored-by: afc163 <afc163@gmail.com> Signed-off-by: Dan M. <danspamable@gmail.com> * Add link for Wrap Custom Component * Update components/tooltip/demo/wrap-custom-component.tsx Signed-off-by: thinkasany <480968828@qq.com> * test: update snap * fix md lint * chore: update docs --------- Signed-off-by: Dan M. <danspamable@gmail.com> Signed-off-by: thinkasany <480968828@qq.com> Co-authored-by: afc163 <afc163@gmail.com> Co-authored-by: thinkasany <480968828@qq.com> Co-authored-by: 𝑾𝒖𝒙𝒉 <wxh1220@gmail.com>
23 lines
1.7 KiB
Markdown
23 lines
1.7 KiB
Markdown
<Antd component="Alert" message="The following FAQ applies to Tooltip, Popconfirm, Popover components." type="warning" banner="true"></Antd>
|
|
|
|
### Why does the warning `findDOMNode is deprecated` sometimes appear in strict mode?
|
|
|
|
This is due to the implementation of `rc-trigger`. `rc-trigger` forces children to accept ref, otherwise it will fall back to findDOMNode, so children need to be native html tags. If not, you need to use `React.forwardRef` transparently passes `ref` to native html tags.
|
|
|
|
- `findDOMNode is deprecated` reproduce: <https://codesandbox.io/p/sandbox/finddomnode-c5hy96>
|
|
- Using `forwardRef` to fix: <https://codesandbox.io/p/sandbox/no-finddomnode-warning-forked-gdxczs>
|
|
|
|
### Why is the tooltip for my custom component not opening?
|
|
|
|
Similar issues: [#15909](https://github.com/ant-design/ant-design/issues/15909), [#12812](https://github.com/ant-design/ant-design/issues/12812).
|
|
|
|
Please ensure that the child node to accept `onMouseEnter`, `onMouseLeave`, `onPointerEnter`, `onPointerLeave`, `onFocus`, and `onClick` events, If you create your own component and do not explicitly add these mouse and pointer events as props, the tooltip will never appear. [See Example](http://ant.design/components/tooltip#tooltip-demo-wrap-custom-component).
|
|
|
|
### What's the placement logic?
|
|
|
|
It will follow `placement` config when screen has enough space. And flip when space is not enough (Such as `top` to `bottom` or `topLeft` to `bottomLeft`). Single direction such as `top` `bottom` `left` `right` will auto shift on the view:
|
|
|
|
<img alt="shift" height="200" src="https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*sxaTTJjLtIMAAAAAAAAAAAAADrJ8AQ/original" />
|
|
|
|
When `placement` is set to edge align such as `topLeft` `bottomRight`, it will only do flip but not do shift.
|