Security News
The Push to Ban Ransom Payments Is Gaining Momentum
Ransomware costs victims an estimated $30 billion per year and has gotten so out of control that global support for banning payments is gaining momentum.
vue-router
Advanced tools
Package description
The vue-router npm package is the official router for Vue.js. It integrates closely with Vue.js core to make building Single Page Applications with Vue.js a breeze. Features include nested routes/mappings, modular, component-based router configuration, route params, query, wildcards, transitions, fine-grained navigation control, and view transition effects powered by Vue.js' transition system.
Dynamic Route Matching
This feature allows you to create routes that are dynamically matched to the path. For example, different user IDs can be matched to the same route pattern.
{"const router = new VueRouter({
routes: [
{ path: '/user/:id', component: User }
]
})
const User = {
template: '<div>User {{ $route.params.id }}</div>'
}"}
Nested Routes
This feature allows you to map nested paths to components. It's useful for creating sub-sections of a page without having to create complex configurations.
{"const router = new VueRouter({
routes: [
{ path: '/user/:id', component: User,
children: [
{
// UserProfile will be rendered inside User's <router-view>
path: 'profile',
component: UserProfile
}
]
}
]
})
const User = {
template: '<div>User <router-view></router-view></div>'
}"}
Programmatic Navigation
Vue-router allows you to navigate without using <router-link> by using the router instance methods.
{"router.push('/home')
router.replace('/home')
router.go(-1)"}
Named Routes
Instead of using URLs, you can navigate using route names, making your code more readable and maintainable.
{"const router = new VueRouter({
routes: [
{ name: 'user', path: '/user/:id', component: User }
]
})
// navigate to a named route
router.push({ name: 'user', params: { id: 123 }})"}
Route Guards
Route guards are used to protect routes that require authentication, perform checks before entering a route, or confirm navigation away from a route.
{"const router = new VueRouter({
routes: [
{ path: '/secret', component: Secret, beforeEnter: (to, from, next) => {
// ... guard logic
next();
}}
]
})"}
React Router is a standard library for routing in React. It has a similar set of features to vue-router, such as dynamic route matching, nested routes, and navigation control, but it is designed for React instead of Vue.
Angular's router is a powerful navigation library for Angular. It offers features like lazy loading, nested routes, and route guards. It is comparable to vue-router but is used within the Angular ecosystem.
Reach Router is a small, simple router for React that is accessible and easy to use. It is similar to vue-router but with a focus on simplicity and accessibility.
Next.js has its own router that supports features like dynamic routes and server-side rendering. It is designed specifically for Next.js applications and offers a different approach compared to vue-router.
Readme
This is vue-router 2.0 which works only with Vue 2.0. For the 1.x router see the 1.0 branch.
vue-router
is the official router for Vue.js. It deeply integrates with Vue.js core to make building Single Page Applications with Vue.js a breeze. Features include:
Get started with the documentation, or play with the examples (see how to run them below).
# install deps
npm install
# build dist files
npm run build
# serve examples at localhost:8080
npm run dev
# lint & run all tests
npm test
# serve docs at localhost:4000 (requires global gitbook-cli)
npm run docs
For questions and support please use the Discord chat server or the official forum. The issue list of this repo is exclusively for bug reports and feature requests.
Please make sure to read the Issue Reporting Checklist before opening an issue. Issues not conforming to the guidelines may be closed immediately.
Please make sure to read the Contributing Guide before making a pull request.
Details changes for each release are documented in the release notes.
Copyright (c) 2013-2017 Evan You
FAQs
> - This is the repository for Vue Router 4 (for Vue 3) > - For Vue Router 3 (for Vue 2) see [vuejs/vue-router](https://github.com/vuejs/vue-router).
We found that vue-router demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Ransomware costs victims an estimated $30 billion per year and has gotten so out of control that global support for banning payments is gaining momentum.
Application Security
New SEC disclosure rules aim to enforce timely cyber incident reporting, but fear of job loss and inadequate resources lead to significant underreporting.
Security News
The Python Software Foundation has secured a 5-year sponsorship from Fastly that supports PSF's activities and events, most notably the security and reliability of the Python Package Index (PyPI).