Home > Web Front-end > Vue.js > Detailed explanation of how to create routing page in Vue project

Detailed explanation of how to create routing page in Vue project

藏色散人
Release: 2022-08-10 17:31:05
forward
2058 people have browsed it

This article will introduce how to create a new routing page in the Vue project. I hope it will be helpful to friends in need!

[Related recommendations: vue.js video tutorial]

The specific steps are as follows:

We now need to create a new test page and name it Test.vue

1: Create a new Test.vue

under components

<template>
    <div>我是测试界面</div>
</template>
 
<script>
</script>
 
<style>
</style>
Copy after login
<template>
    <div>我是测试界面</div>
</template>
 
<script>
</script>
 
<style>
</style>
Copy after login

2: Open App.vue {name:'/components/Test',navItem:'Test interface'},

3: Open the route and import the component index.js

import Test from &#39;@/components/Test&#39;

{
      path: &#39;/components/Test&#39;,
      name: &#39;Test&#39;,
      component: Test
    }
Copy after login

.

The above is the detailed content of Detailed explanation of how to create routing page in Vue project. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:csdn.net
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template