Laravel Named Routes in Vue.js Components

With this feature you can use route() function into vue.js components and this makes pointing the laravel routes easier.

1. Generate list of named routes

In first place enter the Laravel routes to javascript, for that in the js Laravel variable where the csrf_token is already sent, we add the base_url variable and the routes:

This creates the window.Laravel.routes variable that contains an associative array of all laravel named routes.

2. Recreate route() helper in Javascript

You will need to create a file called “route.js”, this function parses all routes when his is called from vue components.

Now in your app.js you must add (before vue instance):

window.route = require('./route');

3 Use it!

Now in you Vue components or axios calls can use:

route(‘post.index’) or
route(‘post.update’, this.post.id)

Hopefully you uses the solution in your projects.

If you like this, please sharing this article and follow me on Twitter Santiago Argilla