使用带有PHP变量的VueJS

Question

我正在尝试绑定一个HTML元素,其中包含一个通过PHP回显的字符串,以便我可以将它与VueJS一起使用.基本上我将要做的是根据一些php/mysql数据库查询(USD是默认值)在GBP和USD之间切换.这是我到目前为止所尝试的简化示例.

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

当然我可以再次回显php变量,但是我想将它绑定到VueJS元素的主要原因是我可以在我的JS中使用这个元素的值来做这样的事情......

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

值得注意的是,我已经在这个#app中有相当多的VueJS工作,所以它与Vue的配置错误无关,更多的是不知道正确的方法来解决问题.

Answer 1

我不会在组件内交错PHP和javascript.为什么不在最后用您需要的变量创建一个新脚本？

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

然后它将是一个全局变量,你只需从那里拿走它.