使用 Wordpress API 和 React 的特殊字符

Question

我正在将 WordPress Rest API 与 React 应用程序一起使用。我有一个名为“Q&A”的类别，wordpress 模板系统能够在渲染时正确翻译它。

但是，当使用动态视图与 React 并从 Wordpress API 检索该数据时，该名称将返回为

"name": "Q&A"

。另外考虑到我想在交付的 HTML 中包含类别作为 React 的初始状态，我猜编码是正确的。

我认为翻译这些字段是客户的责任。将这些响应翻译为要呈现的实际字符串的最佳方法是什么？

Answer 1

这个 js 函数将为您解析这些＆符号：

function parseAmp(s){
  return s.replace('&', '&');
}

希望有帮助！

Answer 2

将此代码写入您的

function.php

文件或自定义插件中：

function is_get_posts_request( \WP_REST_Request $request ) {
    return 'GET' === $request->get_method();
}

function mutate_get_posts_response( $response ) {
    if ( ! ( $response instanceof \WP_REST_Response ) ) {
        return;
    }
    $data = array_map(
        'prefix_post_response',
        
        $response->get_data()
    );
    $response->set_data( $data );
}

function prefix_post_response(  array $post ) {
    if ( isset( $post['title']['rendered'] ) ) {
      
        //$type = $request->get_param( 'type' ),
        $post['title']['rendered'] = html_entity_decode( $post['title']['rendered']);
    }
    return $post;
}

add_filter(
    'rest_request_after_callbacks',
    function( $response, array $handler, \WP_REST_Request $request ) {
        if ( is_get_posts_request( $request ) ) {
            mutate_get_posts_response( $response );
        }
        return $response;
    },
    10,
    3
);

插件链接是这里

Answer 3

这是一个非常常见的问题，我在 WordPress 本身内部修复了它，而不是使用另一个 React 包。基本上，我们需要解码 HTML 并直接将其解析为 JSON。您可以在子主题的functions.php文件中添加以下内容：

function fix_decode_rest_api($response, $post, $request) {
 if (isset($response->data[ 'title' ][ 'rendered' ])) {
    $decodedTitle = html_entity_decode($response->data[ 'title' ][ 'rendered' ]);
    $response->data[ 'title' ][ 'rendered' ] = $decodedTitle;
 }
 return $response;
}
add_filter('rest_prepare_post', 'fix_decode_rest_api', 11, 3);