如何在react-tippy Tooltip中添加HTML？当前仅显示[object Object]

当然可行，你遇到的[object Object]是因为用错了属性：react-tippy的title属性只接受字符串类型，直接传React元素会被默认转成对象字符串。

正确的做法是用content属性代替title，这个属性支持传入React节点：

<Tooltip
    content={<div>
        <h4>Hello</h4>
        <span>This is a span</span>
    </div>}
    position="right"
    trigger="click"
    theme="light"
    arrow="true"
    arrowSize="big"
    distance="3"
    style={{fontSize:14}}
>
    <div>Click Here</div>
</Tooltip>

如果你的HTML内容是字符串形式（比如后端返回的HTML代码），可以用html属性开启HTML解析，同时把字符串传给title，但要注意防范XSS风险：

<Tooltip
    title="<h4>Hello</h4><span>This is a span</span>"
    html={true}
    // 其他属性不变
>
    <div>Click Here</div>
</Tooltip>

内容的提问来源于stack exchange，提问作者morne