WordPress 将对象/JSON 传递给 wp_localize_script

问题描述

我有一个包含对象文字的 javascript 的工作。但是我需要本地化它，我想知道如何重写它，以便我可以得到 wp_localize_script()，并输出正确的格式。

non-localized(非动态) 版本如下所示：

var layoyt_config = {
    'header'        : 1
,   'footer'        : 1
,   'ls'            : {'sb1':1}
,   'rs'            : {'sb1':1,'sb2':1}
,   'align'         : 'center'
};

现在，要让这些值由 php(基于一些 wp_settings) 生成，我想使用 wp_localize_script，所以我可以从它那里获取：

var layoyt_config = my_localized_data.layoyt_config;

并且要获得该数据的对象属性我’thought’ 我可以做到这一点，但显然不是：

$data = array(
    'layout_config' => {
        'header' : 1
    ,   'footer' : 1
    ,   'ls' : {'sb1': 1}
    ,    'rs' : {'sb1': 1,'sb2': 1}
    ,    'align' : 'center'
    }
);
wp_localize_script('my-script-handle', 'my_localized_data', $data);

因为这将导致 PHP 解析错误我尝试重写 json 到数组语法，因为 wp_localize_script 将转换回到对象符号，但这也不适用于我：

$data = array(
    'layout_config' => array(
        'header' => 1
    ,   'footer' => 1
    ,   'ls' => array('sb1'=>1)
    ,    'rs' => array('sb1'=>1,'sb2'=>1)
    ,    'align' => 'center'
    )
);
wp_localize_script('my-script-handle', 'my_localized_data', $data);

而当这个运行顺利的时候，php 解析器，我没有得到我的页面源的预期输出，因为 my_localized_data.layout_config 成为一个字符串”Array”，这里是输出：

<script type='text/javascript'>
    /* <![CDATA[ */
    var wpkit_localized_data = {
    layout_config: "Array"
    };
    /* ]]> */
</script>

所以.. 我该怎么做 (或者我只需要接受，我必须’flatten’ 我的对象成离散的变量，如：

lc_header = '1';
ls_ls_sb1 = '1';
etc...

最佳解决方案

实际上，wp_localize_script()很简单，它只是在值附加了引号，并转义内容，期望它们都是字符串。

然而，阵列中有 l10n_print_after 键，根本没有任何干扰。它可以用于在字符串传递后执行任意代码。您可以使用它来传递额外的数据。

$data = array(
    'layout_config' => {
      'ls' : {'sb1': 1}
    }
);
$reshuffled_data = array(
    'l10n_print_after' => 'my_localized_data = ' . json_encode( $data ) . ';'
);
wp_localize_script('my-script-handle', 'my_localized_data', $reshuffled_data);

你会得到如下代码：

var my_localized_data = {}; // What is left of your array
my_localized_data = {'layout_config': {'ls': {'sb1': 1}}}; // From l10n_print_after

参考文献

pass object/JSON to wp_localize_script

注：本文内容整合自 Google/Baidu/Bing 辅助翻译的英文资料结果。如果您对结果不满意，可以加入我们改善翻译效果：薇晓朵技术论坛。

WordPress 将对象/JSON 传递给 wp_localize_script