在 div 的标题内显示实体定义

【问题标题】：Show entity definitions inside title of divs在 div 的标题内显示实体定义
【发布时间】：2021-05-09 18:10:36
【问题描述】：

在 React 应用程序中有这个 HTML 块：

<div className="my-class" title={myValue}>
   <div>{myValue}</div>
</div>

myValue的内容是MyCompany™。

内部 div 正确显示内容。

但悬停时出现的标题将 ™ 替换为 &trade; 并显示如下：MyCompany&trade;。

为什么标题会出现这种情况？有办法解决吗？

【问题讨论】：

标签： html reactjs character-set

【解决方案1】：

你可以使用dangerouslySetInnerHTML，虽然不太理想，但是没问题。所以，代码应该是这样的：

let title = ["MyCompany", <span>™</span>]
<div className="my-class" dangerouslySetInnerHTML={{__html: title }}>
   <div>{title }</div>
</div>

如果您的实体是动态的，就像您在 cmets 中告诉我的那样，那么我们可以执行以下技巧：

const parseASCII = (string) => { 
  const htmlTextArea = document.createElement('textarea'); 
  textarea.innerHTML = string; 
  return htmlTextArea.value; 
}

【讨论】：

如果我们一直使用这种格式就可以了，但我只是举个例子。实际上，标题可以有也可以没有那个实体，或者它可能位于字符串内
@JeanPierre 我编辑了我的评论，希望对您有所帮助