Issue 406 (#420)
* feat(module: tooltip): support markupstring rendering * docs(module: tooltip): change JSX type to C# type * fix(module: tooltip): change MarkupString rendering mothod * refactor(module: tooltip): redundant code deleted Co-authored-by: James Yeung <shunjiey@hotmail.com>
This commit is contained in:
zxyao
GitHub
Родитель
8a9ab57bb1
Коммит
5b328dbdc6
|
|
@ -22,28 +22,28 @@
|
|||
OverlayChildPrefixCls="@($"{PrefixCls}-menu")"
|
||||
OnOverlayMouseEnter="OnOverlayMouseEnter"
|
||||
OnOverlayMouseLeave="OnOverlayMouseLeave">
|
||||
@if (Title.IsT0 && !string.IsNullOrEmpty(Title.AsT0))
|
||||
{
|
||||
<div class="ant-tooltip-content">
|
||||
<div class="ant-tooltip-arrow">
|
||||
<span class="ant-tooltip-arrow-content"></span>
|
||||
</div>
|
||||
<div class="ant-tooltip-inner" role="tooltip">
|
||||
@if (Title.Value != null)
|
||||
{
|
||||
<div class="ant-tooltip-content">
|
||||
<div class="ant-tooltip-arrow">
|
||||
<span class="ant-tooltip-arrow-content"></span>
|
||||
</div>
|
||||
<div class="ant-tooltip-inner" role="tooltip">
|
||||
@if (Title.IsT0 && !string.IsNullOrWhiteSpace(Title.AsT0))
|
||||
{
|
||||
@Title.AsT0
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
else if (Title.IsT1 && (Title.AsT1)!=null)
|
||||
{
|
||||
<div class="ant-tooltip-content">
|
||||
<div class="ant-tooltip-arrow">
|
||||
<span class="ant-tooltip-arrow-content"></span>
|
||||
</div>
|
||||
<div class="ant-tooltip-inner" role="tooltip">
|
||||
}
|
||||
else if (Title.IsT1)
|
||||
{
|
||||
@Title.AsT1
|
||||
</div>
|
||||
}
|
||||
else if (Title.IsT2)
|
||||
{
|
||||
@Title.AsT2
|
||||
}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
</Overlay>
|
||||
</CascadingValue>
|
||||
</CascadingValue>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ namespace AntDesign
|
|||
public partial class Tooltip : OverlayTrigger
|
||||
{
|
||||
[Parameter]
|
||||
public OneOf<string, RenderFragment> Title { get; set; } = string.Empty;
|
||||
public OneOf<string, RenderFragment, MarkupString> Title { get; set; } = string.Empty;
|
||||
|
||||
[Parameter]
|
||||
public bool ArrowPointAtCenter { get; set; } = false;
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ A simple text popup tip.
|
|||
|
||||
| Property | Description | Type | Default |
|
||||
| -------- | ----------------------------- | ---------------------------------- | ------- |
|
||||
| title | The text shown in the tooltip | string\|ReactNode\|() => ReactNode | - |
|
||||
| Title | The text shown in the tooltip | string\|RenderFragment | string.Empty |
|
||||
|
||||
### Common API
|
||||
|
||||
|
|
@ -23,19 +23,18 @@ The following APIs are shared by Tooltip, Popconfirm, Popover.
|
|||
|
||||
| Property | Description | Type | Default | Version |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| arrowPointAtCenter | Whether the arrow is pointed at the center of target | boolean | `false` | |
|
||||
| autoAdjustOverflow | Whether to adjust popup placement automatically when popup is off screen | boolean | `true` | |
|
||||
| defaultVisible | Whether the floating tooltip card is visible by default | boolean | `false` | |
|
||||
| getPopupContainer | The DOM container of the tip, the default behavior is to create a `div` element in `body` | Function(triggerNode) | () => document.body | |
|
||||
| mouseEnterDelay | Delay in seconds, before tooltip is shown on mouse enter | number | 0.1 | |
|
||||
| mouseLeaveDelay | Delay in seconds, before tooltip is hidden on mouse leave | number | 0.1 | |
|
||||
| overlayClassName | Class name of the tooltip card | string | - | |
|
||||
| overlayStyle | Style of the tooltip card | object | - | |
|
||||
| placement | The position of the tooltip relative to the target, which can be one of `top` `left` `right` `bottom` `topLeft` `topRight` `bottomLeft` `bottomRight` `leftTop` `leftBottom` `rightTop` `rightBottom` | string | `top` | |
|
||||
| trigger | Tooltip trigger mode. Could be multiple by passing an array | `hover` \| `focus` \| `click` \| `contextMenu` \| `Array<string>` | `hover` | |
|
||||
| visible | Whether the floating tooltip card is visible or not | boolean | `false` | |
|
||||
| onVisibleChange | Callback executed when visibility of the tooltip card is changed | (visible) => void | - | |
|
||||
| align | this value will be merged into placement's config, please refer to the settings [rc-tooltip](https://github.com/react-component/tooltip) | Object | - | |
|
||||
| ArrowPointAtCenter | Whether the arrow is pointed at the center of target | bool | `false` | |
|
||||
| AutoAdjustOverflow | Whether to adjust popup placement automatically when popup is off screen | bool | `true` | |
|
||||
| DefaultVisible | Whether the floating tooltip card is visible by default | bool | `false` | |
|
||||
| PopupContainerSelector | The DOM container of the tip, the default behavior is to create a `div` element in `body` | string (css selector) | - | |
|
||||
| MouseEnterDelay | Delay in seconds, before tooltip is shown on mouse enter | doube | 0.1 | |
|
||||
| MouseLeaveDelay | Delay in seconds, before tooltip is hidden on mouse leave | doube | 0.1 | |
|
||||
| OverlayClassName | Class name of the tooltip card | string | - | |
|
||||
| OverlayStyle | Style of the tooltip card | string | - | |
|
||||
| Placement | The position of the tooltip relative to the target, which can be one of `Top` `Left` `Right` `Bottom` `TopLeft` `TopRight` `BottomLeft` `BottomRight` `LeftTop` `LeftBottom` `RightTop` `RightBottom` | PlacementType | `PlacementType.Top` | |
|
||||
| Trigger | Tooltip trigger mode. Could be multiple by passing an array | TriggerType[] | `TriggerType.Hover` | |
|
||||
| Visible | Whether the floating tooltip card is visible or not | bool | `false` | |
|
||||
| OnVisibleChange | Callback executed when visibility of the tooltip card is changed | EventCallback<bool> | - | |
|
||||
|
||||
## Note
|
||||
|
||||
|
|
|
|||
|
|
@ -17,27 +17,26 @@ title: Tooltip
|
|||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ----- | -------- | ---------------------------------- | ------ |
|
||||
| title | 提示文字 | string\|ReactNode\|() => ReactNode | 无 |
|
||||
| Title | 提示文字 | string\|RenderFragment | string.Empty |
|
||||
|
||||
### 共同的 API
|
||||
|
||||
以下 API 为 Tooltip、Popconfirm、Popover 共享的 API。
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| arrowPointAtCenter | 箭头是否指向目标元素中心 | boolean | `false` | |
|
||||
| autoAdjustOverflow | 气泡被遮挡时自动调整位置 | boolean | `true` | |
|
||||
| defaultVisible | 默认是否显隐 | boolean | false | |
|
||||
| getPopupContainer | 浮层渲染父节点，默认渲染到 body 上 | Function(triggerNode) | () => document.body | |
|
||||
| mouseEnterDelay | 鼠标移入后延时多少才显示 Tooltip，单位：秒 | number | 0.1 | |
|
||||
| mouseLeaveDelay | 鼠标移出后延时多少才隐藏 Tooltip，单位：秒 | number | 0.1 | |
|
||||
| overlayClassName | 卡片类名 | string | 无 | |
|
||||
| overlayStyle | 卡片样式 | object | 无 | |
|
||||
| placement | 气泡框位置，可选 `top` `left` `right` `bottom` `topLeft` `topRight` `bottomLeft` `bottomRight` `leftTop` `leftBottom` `rightTop` `rightBottom` | string | top | |
|
||||
| trigger | 触发行为，可选 `hover/focus/click/contextMenu`，可使用数组设置多个触发行为 | string \| string[] | hover | |
|
||||
| visible | 用于手动控制浮层显隐 | boolean | false | |
|
||||
| onVisibleChange | 显示隐藏的回调 | (visible) => void | 无 | |
|
||||
| align | 该值将合并到 placement 的配置中，设置参考 [rc-tooltip](https://github.com/react-component/tooltip) | Object | 无 | |
|
||||
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|
||||
| ---------------------- | ------------------------------------------------------------ | ------------------- | ----------------- | ---- |
|
||||
| ArrowPointAtCenter | 箭头是否指向目标元素中心 | bool | `false` | |
|
||||
| AutoAdjustOverflow | 气泡被遮挡时自动调整位置 | bool | `true` | |
|
||||
| DefaultVisible | 默认是否显隐 | bool | false | |
|
||||
| PopupContainerSelector | 浮层渲染父节点，默认渲染到 body 上 | string (css选择器) | - | |
|
||||
| MouseEnterDelay | 鼠标移入后延时多少才显示 Tooltip，单位：秒 | double | 0.1 | |
|
||||
| MouseLeaveDelay | 鼠标移出后延时多少才隐藏 Tooltip，单位：秒 | double | 0.1 | |
|
||||
| OverlayClassName | 卡片类名 | string | 无 | |
|
||||
| OverlayStyle | 卡片样式 | string | 无 | |
|
||||
| Placement | 气泡框位置，可选 `Top` `Left` `Right` `Bottom` `TopLeft` `TopRight` `BottomLeft` `BottomRight` `LeftTop` `LeftBottom` `RightTop` `RightBottom` | PlacementType | PlacementType.Top | |
|
||||
| Trigger | 触发行为，可选 Her/Focus/Click/ContextMenu`，可使用数组设置多个触发行为 | TriggerType[] | TriggerType.Hover | |
|
||||
| Visible | 用于手动控制浮层显隐 | bool | false | |
|
||||
| OnVisibleChange | 显示隐藏的回调 | EventCallback<bool> | - | | | bool | false | |
|
||||
|
||||
## 注意
|
||||
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче