Getting data from PHP controller into Vue

Question

I have a backend written in PHP, frontend with Twig templates and Vue components. I'm trying to pass data from my PHP controller into my Vue component, and I'm really not sure how to do this.

Let's say I have this in my controller:

    return $this->render('setting/setting.html.twig', [
  'title' => 'Your Etsy Settings',
  'tab' => 'Settings',
  'sub_title' => 'integrated with etsy',
  'message' => '',
  'settingForm' => $form->createView(),
  'storeId' => $store->getId()
]);

How can I access 'title' in my Vue component? Part of my template is Twig, and then I'm rendering my Vue components inside the Twig template.

You'd have to pass them to the Vue component (as a prop) within the Twig template. Something along the lines of <your-vue-component :title="{{ title }}">. (Sorry, I don't know Twig's syntax exactly, but that's the basic idea.) — ceejayoz
– ceejayoz, Commented Feb 13, 2019 at 19:20

tony19 · Accepted Answer · 2022-07-15 00:31:13Z

1

Probably the problem is {{}} then you can swap

new Vue({
    delimiters: ['${', '}']
})

...

<your-vue-component :title="${ {{ title }} }">

https://v2.vuejs.org/v2/api/#delimiters

edited Jul 15, 2022 at 0:31

tony19

140k23 gold badges281 silver badges354 bronze badges

answered Feb 13, 2019 at 19:34

Семён Плевако

512 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Getting data from PHP controller into Vue

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related