Vue Router is the official router for Vue.js to make building Single Page Applications by allowing you to link URLs to specific components.
Features include:
- Nested route/view mapping
- Modular, component-based router configuration
- Route params, query, wildcards
- View transition effects powered by Vue.js' transition system
- Fine-grained navigation control
- Links with automatic active CSS classes
- HTML5 history mode or hash mode, with auto-fallback in IE9
- Customizable Scroll Behavior
We are going to use vue-router to assign each menu element to the component we want to show. Let's get started!
Setup
Open your terminal and run these commands below:
App.js
Go to the main JavaScript file resources/assets/js/app.js and update with the code below:
Components
Create the vue.js components
View
Update welcome.blade.php
Styles
Now add some style public/css/mystyle.css
Final Steps
Start the app with the command below:
I hope this example will be of help to you. 🐈
Be creative and have fun along the way.
Song while I was writing the post ☺️ https://open.spotify.com/track/4as4XEOR03oGm1STUKl6pa?si=DwWg9bE7Sdmur8OTQ-7ijA
Thanks for reading!
Have a nice day, coders💜
Top comments (2)
Hola, buscando sobre Vue encontre tu blog, bueno disculpa por poner en spanish es que mi ingles es malo. Bueno me da gusto haber encontrado y espero contactarte pronto. Se me olvidaba soy Alberto espero que aun te acuerdes.
The images are too small.