使用WordPress REST API用于Gutenberg块时，不会解码HTML实体

Question

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

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

title: {
    rendered: "This has a hyphen &#8211; 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,
    };
});

Bazoozaa！ HTML实体消失了。