React Native中如何正确转换并显示无HTML标签与引号的字符串？

针对你遇到的HTML字符串转纯文本需求，这里提供两种可行的React Native适配方案：

方案一：自定义处理（正则清标签+实体解码） #

适合简单场景，无需依赖第三方库：

1. 先写一个HTML实体解码函数，覆盖常见转义字符：

function decodeHtmlEntities(text) {
  const entityMap = {
    '"': '"',
    ''': "'",
    '&': '&',
    '&lt;': '<',
    '&gt;': '>'
  };
  return text.replace(/&quot;|&#039;|&amp;|&lt;|&gt;/g, match => entityMap[match]);
}

2. 再结合正则移除所有HTML标签，最终得到纯文本：

function convertHtmlToPlainText(html) {
  // 移除所有HTML标签（匹配<开头、>结尾的内容）
  const withoutTags = html.replace(/<[^>]+>/g, '');
  // 解码转义的HTML实体
  return decodeHtmlEntities(withoutTags);
}

用你的示例文本测试：
输入：

<pre><code>&quot;What is the name of James Dean&amp;#039;s character in the 1955 movie &amp;quot;Rebel Without a Cause&amp;quot;?&quot;</code></pre>

输出结果：
"What is the name of James Dean's character in the 1955 movie "Rebel Without a Cause"?"

方案二：使用第三方库（更全面的实体支持） #

如果需要处理更多罕见的HTML实体，推荐用html-entities库：

1. 安装依赖：

npm install html-entities --save

2. 引入并使用：

import { decode } from 'html-entities';

function convertHtmlToPlainText(html) {
  // 先移除HTML标签
  const withoutTags = html.replace(/<[^>]+>/g, '');
  // 调用库的解码方法处理所有实体
  return decode(withoutTags);
}

注意事项 #

• 如果你的HTML包含复杂嵌套标签或特殊格式，简单正则可能无法完全清理，这时可以考虑使用react-native-html-parser这类更专业的HTML解析库，先解析出文本节点再提取内容。
• 测试时注意覆盖所有可能出现的转义实体，避免出现残留的&xxx;格式内容。

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