I want to access a variable $count from my controller and access it to a vue component (frontend). currently have this code on my controller:
public function index()
{
$count = User::where('created_at', Carbon::today())->count();
return view('user.index', compact('count'));
}
i am quite new to laravel and vuejs so please help me out. thank you!
Send count as a prop from blade to component
<your-component-name :count="{{ $count }}"></your-component-name>
And from your component, receive that prop
<template>
<div>
Count is {{ count }}
</div>
</template>
<script>
export default {
props: {
count: {
type: Number
}
}
}
</script>
To pass down data to your components you can use props. Find more info about props over here. This is also a good source for defining those props.
You can do something like:
<example :userId="{{ Auth::user()->id }}"></example>OR
<example v-bind:userId="{{ Auth::user()->id }}"></example>And then in your
Example.vuefile you have to define your prop. Then you can access it by this.userId.Like :
<script> export default { props: ['userId'], mounted () { // Do something useful with the data in the template console.dir(this.userId) } } </script>
the above question was answered in below question Pass data from blade to vue component
