web-dev-qa-db-fra.com

wp_localize_script avec boolean et init

J'ai un problème avec wp_localize_script, que je ne peux pas obtenir booléen et int comme variable

wp_enqueue_script( 'helloworld' , 'helloworld.js', false, '1.0.0', true);

$site_config = array();

$site_config['boo'] = (bool)true;
$site_config['number'] = (int)1;

wp_localize_script( 'helloworld' , 'site_config' , $site_config );

Pourquoi je reçois:

var site_config = {"boo":"1","number":"1"};

Pourquoi pas:

var site_config = {"boo":true,"number":1};
  • Wordpress 4.6 (dernière)
  • PHP 5.6.10

N'est-ce pas réparé? https://core.trac.wordpress.org/ticket/25280 , je fais quelque chose de mal ou quelque chose manque?

2
l2aelba

Je viens de faire quelque chose comme ça si longtemps:

wp_add_inline_script('helloworld','var site_config ='.json_encode($site_config));
1
l2aelba

Pourquoi partie:

La partie Pourquoi peut être trouvée dans la méthode WP_Scripts::localize():

foreach ( (array) $l10n as $key => $value ) {
    if ( !is_scalar($value) )
        continue;

    $l10n[$key] = html_entity_decode( (string) $value, ENT_QUOTES, 'UTF-8');
}

où on note le casting (string).

Solutions de contournement:

Le dernier correctif proposé suggère de remplacer is_scalar() par is_string() et de supprimer la conversion (string). Cela fonctionnerait par exemple dans un wrapper personnalisé. Mais je ne pense pas que ce soit la voie à suivre ici, car la méthode de base wp_scripts()->localize() peut toujours changer à l'avenir.

Je pense aussi qu'il est trop compliqué de modifier les données à l'aide des méthodes suivantes:

wp_scripts()->get_data( $handle, 'data' )

et

wp_scripts()->add_data( $handle, 'data', $data )

En le faisant correctement, nous pourrions éventuellement écrire un wrapper en double pour wp_scripts()->localize() ;-)

Une solution plus flexible pourrait consister à utiliser la fonction principale :

wp_add_inline_script( $handle, $data, $position )` 

d'ajouter nos valeurs dynamiques non-string .

2
birgire

Si la valeur booléenne est true , elle retournera toujours 1 ou si la valeur booléenne est false alors il retournera vide c'est pourquoi vous obtenez 1 dans le cas de vrai.

Le code ci-dessous est testé sur mon projet local. Copier et coller exactement

//Add it in **functions.php**
function load_localize_scripts() {
    wp_enqueue_script('localize_script', get_template_directory_uri() . '/js/localize_script.js', array(), '1.0.0', true );
    wp_localize_script('localize_script', 'localize_scripts_vars', array(
                        'boolean' => true, // it will return 1 
                        'integer' => 10 // it will always return integre
            )
    );
}
add_action('wp_enqueue_scripts', 'load_localize_scripts');

//Add this in **localize_script.js**
jQuery(document).ready(function() {
    var site_config;
    if (localize_scripts_vars.boolean == '1') {
        site_config = {"boolean":'true',"number":localize_scripts_vars.integer};
        console.log(site_config);
    } else if (localize_scripts_vars.boolean == '' || localize_scripts_vars.boolean == NULL) {
        site_config = {"boolean":'false',"number":localize_scripts_vars.integer};
        console.log(site_config);
    };
});

Vous pouvez aussi voir le résultat consol
enter image description here

1
Faisal Ramzan