React Native中如何正确解析WordPress返回的HTML实体？

嘿，我之前也碰到过一模一样的问题！WordPress返回的内容里经常带着各种HTML实体，像&#8222这类特殊引号确实很难直接处理。下面几个方法亲测好用，你可以根据自己的需求选：

方法一：使用html-entities库（推荐处理纯文本实体） #

这是最直接的方案，专门用来解码各种HTML实体，支持十进制、十六进制和命名实体。

1. 先安装库：

npm install html-entities --save
# 或者用yarn
yarn add html-entities

2. 在代码中使用解码函数：

import { decode } from 'html-entities';

// 假设从WordPress获取的带实体文本
const wpText = '这是带有特殊引号的文本„测试内容';
const decodedText = decode(wpText);

// 现在decodedText里的实体已经被转换成正常的引号了
console.log(decodedText); // 输出：这是带有特殊引号的文本„测试内容

这个库能处理几乎所有常见的HTML实体，包括你提到的&#8222（双低引号），完全不用自己操心各种实体的对应关系。

方法二：用react-native-render-html渲染HTML内容（适合带标签的完整内容） #

如果你的WordPress返回的是完整的HTML片段（不止是纯文本，还有<p>、<h1>这类标签），那用这个库更合适——它不仅会自动解析HTML实体，还能把HTML标签转换成React Native可渲染的组件。

1. 安装库：

npm install react-native-render-html --save
# 或者yarn
yarn add react-native-render-html

2. 在组件中使用：

import RenderHTML from 'react-native-render-html';

const wpHtmlContent = '<p>这是带有特殊引号的文本&#8222;测试段落</p>';

// 在你的组件render里
return (
  <RenderHTML source={{ html: wpHtmlContent }} />
);

渲染出来的内容会自动解析实体，同时保留HTML的结构和基本样式，非常省心。

方法三：手动解码（适合简单场景，不推荐复杂情况） #

如果你不想引入第三方库，只需要处理十进制实体（比如&#xxxx;这种格式），可以写一个简单的解码函数：

const decodeDecimalEntities = (text) => {
  return text.replace(/&#(\d+);/g, (match, decimalCode) => {
    return String.fromCharCode(parseInt(decimalCode, 10));
  });
};

// 使用示例
const decoded = decodeDecimalEntities('„这是测试');
console.log(decoded); // 输出：„这是测试

不过要注意，这个方法只能处理十进制实体，像 这种命名实体或者十六进制实体（&#xXXXX;）就无能为力了，所以复杂场景还是推荐用前两个方法。

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