将 WordPress REST API 用于 Gutenberg 块时，不会对 HTML 实体进行解码

Question

我正在构建一个自定义的 Gutenberg 块，它向 WordPress REST API 发出请求以获取一些帖子。我正在使用axios向 REST 端点发出请求。

当结果返回时，有一个 Post 对象数组，我可以看到 Posts 的标题，但它们都包含在 JSON 对象中，title.rendered并且包含 HTML 实体，例如。

title: {
    rendered: "This has a hyphen – oh dear"
}`

我正在尝试<SelectControl>使用结果数据填充 a ，因此无法使用dangerouslySetInnerHTML可以解决实体问题的 React方法。那么在填充选项时如何摆脱这些实体呢？

这是我用来从 REST 响应中填充选项的代码：

const options = response.data.map((post) => {
    return {
        label: post.title.rendered,
        value: post.id,
    };
});

Answer 1

这不是很明显，但实际上 Blocks API 中提供了一种方法来执行此操作。

在块代码的顶部，键入：

const { decodeEntities } = wp.htmlEntities;

然后你可以像这样使用它：

const options = response.data.map((post) => {
    return {
        label: decodeEntities(post.title.rendered),
        value: post.id,
    };
});

火箭筒！HTML 实体消失了。