Introduction to the method of implementing route jump in vue2.0 project

This article mainly introduces the detailed method of implementing route jump in vue2.0 project. It is very good and has certain reference value. Friends in need can refer to it

1. Installation

1. Install routing vue-router:

npm install vue-router

The dependency file node_modules of the vue project has a vue-router dependency, indicating that the installation is successful

2. The vue project introduces vue-ruoter:

## 2. Application

1. Path configuration (page jump):

Method 1: If there are not many pages to switch, you can configure it directly in the main.js file.

Method 2: If there are many pages to switch, you can create a js file specifically for routing and configure the path in it.

1) router.js configuration file

2) Import router.js routing file into main.js

2. Call in the component

1) Use the router-view tag to provide a container for the jump of the vue component

2) Use the router-link tag to implement the jump (it is similar to the a tag, the difference is that the router-link jump does not require refreshing the page)

Jump to table component:

3. Implement the effect

project Home page:

Click on the table to jump to:

The above is the entire article Content, I hope it will be helpful to everyone’s learning. For more related content, please pay attention to the PHP Chinese website!

Related recommendations:

vue How to keep the scroll bar of the div at the bottom after rendering the page

vue project Optimizing the method of caching keep-alive data

The above is the detailed content of Introduction to the method of implementing route jump in vue2.0 project. For more information, please follow other related articles on the PHP Chinese website!