[Vuejs]-Laravel Jetstream Adding Google Analytics

by

0👍

I opted in for using Inertia::share then on my app.blade I referenced the respective elements such as title etc as props.

Eg. RouteController (returns Inertia View):

Inertia::share([
            'title' => $title,
            'description' => $description,
            'meta_image' => $meta_image,
            'meta_url' => $meta_url
        ]);
return Inertia::render...

App.blade:

<title>{{$page['props']['title'] ?? ''}}</title>
<meta name="description" content="{{$page['props']['description'] ?? ''}}">
...

And finally in my AppLayout.vue I have a watch on these props for page changes:

watch: {
        "$page.props.title"(newTitle) {
            this.setPageData();
        },
        "$page.props.description"(newDescription) {
            this.setPageData();
        },
    },

Only really need to watch the Title as robots should load each page fresh (for SEO purposes) but the this works well for meta tags (Open Graph) and also GA to track each page.

Leave a comment