将 WordPress REST API 用于 Gutenberg 块时，未解码 HTML 实体答案

【问题标题】：HTML entities are not being decoded when using WordPress REST API for Gutenberg blocks将 WordPress REST API 用于 Gutenberg 块时，未解码 HTML 实体
【发布时间】：2019-02-13 04:42:30
【问题描述】：

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

返回结果时，有一个 Post 对象数组，我可以看到 Posts 的标题，但它们都包含在 JSON 对象中，为 title.rendered 并包含 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,
    };
});

【问题讨论】：

标签： wordpress rest block html-entities wordpress-gutenberg

【解决方案1】：

这不是很明显，但实际上 Blocks API 中提供了一种方法可以做到这一点。

在代码块的顶部，输入：

const { decodeEntities } = wp.htmlEntities;

那么你可以这样使用它：

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

火箭筒！ HTML 实体消失了。

【讨论】：

就我而言，我添加了这一行：import {decodeEntities} from "@wordpress/html-entities"; after run npm install @wordpress/html-entities --save
是的 - 如果您使用 @wordpress 导入（我也在使用它），那效果很好 - 我会将其添加到答案中

【解决方案2】：

为什么不使用rest_prepare_<post_type> 过滤器？

$post_type = "post"
add_filter( "rest_prepare_".$post_type, 'prefix_title_entity_decode'] , 10, 1 ); 
function prefix_title_entity_decode($response){
    $data = $response->get_data();
    $data['title']['rendered'] = html_entity_decode( $data['title']['rendered']);
    $response->set_data($data);
    return $response;
}

【讨论】：