Verwenden von VueJS mit einer PHP-Variablen

Question

Ich versuche, ein HTML-Element zu binden, das eine Zeichenfolge enthält, die über PHP ausgegeben wird, sodass ich es mit VueJS verwenden kann. Im Wesentlichen werde ich zwischen GBP und USD wechseln, abhängig von einigen php/mysql Datenbankabfragen (USD ist der Standardwert). Hier ist ein vereinfachtes Beispiel von dem, was ich bisher versucht habe.

<div id="app"> 
    <?php $string = 'GBP'; ?> 
    <!-- Hide this from the front end but bind to Vue somehow --> 
    <span v-el:currency style="display: none;"><?php echo $string; ?></span> 

    <p>Payment currency: {{ currency }}</p> 
</div> 

Natürlich könnte ich echo nur den PHP-Variable wieder, aber der Hauptgrund, warum ich es zu einem VueJS Elemente binden will, ist so ich den Wert dieses Elements in meinem JS, so etwas zu tun, verwenden kann. ..

if (this.currency === 'GBP') { 
    return "Paying in GBP"; 
} else { 
    return "Paying in USD"; 
} 

Bemerkenswert, dass ich schon ein gutes Stück von VueJS habe in diesem #app arbeiten, damit es ist nichts mit der Konfiguration von Vue ist falsch, mehr ein Fall von nur nicht zu wissen, die richtige Art und Weise zu tun, zu nähern Das Thema.

Answer 1

Ich würde nicht PHP und Javascript in einer Komponente verschachteln. Warum erstellen Sie am Ende kein neues Skript mit den benötigten Variablen?

<!-- bottom of the body --> 
<script>var currency = <?php echo $yourVar; ?></script> 

Und dann wird es eine globale Variable sein und Sie nehmen es einfach von dort.