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

Question

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

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

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

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

这是我用来从 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 实体消失了。