Set Vue data from Laravel controller

Question

I'm new in Vue and I try to set variable from Laravel controller to div using vuejs.

I've set variable in laravel controller and pass to the view on the following way:

$Category = Session::get('Category'); 
//I was previously set that session field and it's string 'category'

return view('index', compact('Category');

How i can read that variable in vuejs?

Answer 1

you can simply pass the stuff as property. If you component has a categories property

....
props: ['categories'],
...

And you use it like

<my-category-example-component :categories="json_encode($Category)"></my-category-example component>

Then you can access the information in your methods

methods: {
   test: function() { alert(this.categories); }
}

or in your template

<li v-for="category in categories">{{ cartegory }}</li>