material-ui 为SpeedDialAction的slotProps提供工具提示会导致在html中显示[object object],

5ktev3wc 于 6个月前发布在其他

关注(0)|答案(6)|浏览(53)

重复问题

我搜索了现有的问题

重现步骤 🕹

链接到实时示例： https://codesandbox.io/s/hardcore-sound-31v0eu
步骤：

创建一个 SpeedDial,其中包含一个或多个 SpeedDialAction
将一个 slotProps prop 添加到 SpeedDialAction,并附带一个类型为 typescript-valid 的对象

当前行为 😯

检查 #SpeedDialtooltipexample-action-0 等，您可以看到它在 html 中获得了一个带有 [object object]

的字面量属性。

预期行为 🤔

Slotprops 应按预期应用于工具提示。

上下文 🔦

我正在尝试自定义属于 SpeedDialAction 的子组件的颜色和其他样式。

您的环境 🌎

我附加了一个代码沙箱。

material-ui

来源：https://github.com/mui/material-ui/issues/35230

6条答案

按热度按时间

j2cgzkjk1#

理想的为Tooltip添加类的方法不是通过slotProps,而是通过TooltipClasses,但似乎也存在一个问题，所以我创建了一个PR。
在这份文档中搜索TooltipClasses https://mui.com/material-ui/api/speed-dial-action/

<SpeedDialAction
            TooltipClasses={{
              tooltip: "your class name"
            }}
            key={action.name}
            icon={action.icon}
            tooltipTitle={action.name}
            tooltipOpen
            onClick={handleClose}
          />

赞(0）回复(0）举报 6个月前

ibps3vxo2#

非常感谢！之前我也遇到了tooltipClasses的问题，但是没有像slotProps那样明显的问题，所以我以为自己做错了什么。

赞(0）回复(0）举报 6个月前

icnyk63a3#

回答原始问题，同意 slotProps & slots 可能是我们今后要添加到所有组件中的内容。
对于特定元素的问题(回答 @sai6855 的观点),人们应该在 classes prop 中使用 staticTooltipLabel 键。我们故意没有使用 TooltipClasses ,因为在这种情况下我们渲染的组件不是一个 Tooltip 。添加一个类可能会引发更多问题，因为我们在与 Tooltip 组件实现自定义元素方面存在冲突，这是不正确的。