9 ms·
If you mix server-side rendered apps with Vue, this is the most common way. Second method is to push the data to a window.__data.staffMemberOptions = "{{ foo }}
by kangoo1707 8y ago
If you mix server-side rendered apps with Vue, this is the most common way. Second method is to push the data to a window.__data.staffMemberOptions = "{{ foo }}" and use it in Vue.
- pbowyer 8y agoThanks, good to hear. Elsewhere I've added something similar, and populate the data this way: var vue = new Vue({ el: '#app', created: function () { for (var key in __app.dataForVue) { this[key] = __app.dataForVue[key]; } }, // ... };
- mkopinsky 8y agoOr as another approach: <!-- inventory.html.twig: --> <div id="app" data-inventory="{{ inventory | json_encode }}" > </div> // main.js new Vue({ template: '<App :inventory="inventory"/>', components: {App}, data() { return { inventory: null } }, beforeMount: function () { this.inventory = JSON.parse(this.$el.attributes['data-inventory'].value); } }).$mount('#app');