Home >Web Front-end >Vue.js >How to configure routing in vue.js

How to configure routing in vue.js

王林
王林Original
2021-09-29 17:39:142942browse

How to configure routing in vue.js: 1. Install vue-router; 2. Reference vue-router; 3. Configure routing files, such as [var router = new VueRouter({routes:[{path:" /hello",component...】.

How to configure routing in vue.js

The operating environment of this article: windows10 system, vue.js 2.9, thinkpad t480 computer.

The steps for vue.js to configure routing are as follows:

Installation

npm install --save vue-router

Reference

import VueRouter from 'vue-router'

Configuration routing file

var router = new VueRouter({
   routes:[
    {
      path:"/hello",
      component:HelloWorld
    },
    {
      path:"/wen",
      component:HelloWen
    }
   ]
   })
    
   new Vue({
   el: '#app',
   components: { App },
   router,
   template: &#39;<App/>&#39;
   })

View loaded Location

Add975b587bf85a482ea10b0a28848e78a4dd6e4ababe59793a4ac75fb9e5c5550e

to the default App.vue file

Jump navigation

<router-link to="/hello">helloword</router-link>(渲染出来的是a标签)
Recommended learning:
php Training

######

The above is the detailed content of How to configure routing in vue.js. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn