Geek Answers Handbook

Using VueJS with a PHP variable

I am trying to link an HTML element that contains a string echoed through PHP so that I can use it with VueJS. Essentially, what I'm going to do is switch between GBP and USD depending on some php / mysql database queries (default value is USD). Here is a simplified example of what I have tried so far.

<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>

Of course, I could repeat the PHP variable again, but the main reason I want to bind it to a VueJS element is that I can use the value of that element in my JS to do something like this ...

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

It is worth noting that I already have a fair bit of VueJS working in this #app, so this is not due to the fact that the Vue configuration is incorrect, moreover, just not knowing how to approach the problem correctly.

+4
1

PHP javascript . script ?

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

, .

+8

More articles:


All Articles