Alternative binding syntax in Vue.js Alternative binding syntax in Vue.js vue.js vue.js

Alternative binding syntax in Vue.js


You could use the v-text directive:

<div v-text="hello_string"></div><!-- same as --><div>{{ hello_string }}</div>

or the v-html:

<div v-html="html"></div><!-- same as --><div>{{{ html }}}</div>


Vue.component({    el:'#app',    data:function(){        return {            hello_string:"<?php echo json_encode($hello_string) ?>"        };    }});

Then in HTML:

<div id="app><div>{{ hello_string }}</div></div>

Basically you need to use PHP to fill your javascript variables, whether you do it through AJAX or just printing out the variables like above is up to you. You probably need to encode it to JSON or at least make sure quotes are escaped. On the front end, let Vuejs manage the view rather than printing directly into it with PHP.