vue官方文档

src/views/Login.vue

<template>
<div>
<h2>登录页</h2>
</div>
</template> <script>
export default {
name: "Login"
}
</script>

router/index.js

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import Login from '@/views/Login' Vue.use(Router) export default new Router({
routes: [
{
path: '/hello',
name: 'HelloWorld',
component: HelloWorld
},{
path: '/login',
name: 'Login',
component: Login
}
]
})

vue2 页面路由的更多相关文章

  1. vue2.0路由

    现在用vue-cli搭建的环境里面vue-router是下载好的 vue2.0路由方式和以前也有些不同 没了了map和start方法 目录结构如上图 这里有三个文件,app.vue显示,main.js ...

  2. 微信小程序之页面路由(九)

    [未经允许,请勿以任何形式转载] 什么是路由? 我们通常理解的路由指分组数据包从源到目的地时,决定端到端路径的网络范围的进程: 借用上面的定义,我们可以理解小程序页面路由,根据路由规则(路径)从一个页 ...

  3. vue1与vue2的路由 以及vue2项目大概了解

    vue1的路由 1.设置根组件  Vue.extend() 2.设置局部组件  Vue.extend({template:"/home"}) 3.实例化路由   var route ...

  4. 微信小程序之页面路由

    路由方式 简介 对于路由的触发方式以及页面生命周期函数如下: 路由方式 触发时机 路由前页面 路由后页面 初始化 小程序打开的第一个页面   onLoad, onSHow 打开新页面 调用 API w ...

  5. AngularJS ui-router刷新子页面路由

    网上有各种刷新子页面路由的方法,但是不知道为什么放到我的页面就不行了,尴尬! 网上的方法有: <a href="#" ui-sref="app.toMenu&quo ...

  6. BackBone结合ASP.NET MVC实现页面路由操作

    1. 问题的背景 什么是页面路由操作,就是通过浏览器地址栏的标记来实现页面内部的一些操作,这些操作具有异步性和持久性.应用场景主要有页面操作过程中的添加收藏夹的操作.后退操作等过程中能完全恢复界面. ...

  7. 微信小程序开发——以简单易懂的浏览器页面栈理解小程序的页面路由

    前言: 对于小程序的页面路由,如果没有一定开发经验的话,理解起来还是会有些困难的.哪怕是有一定小程序开发经验的开发者,能够完全理解掌握的恐怕也不多. 这里就以另外一种方式来详细的介绍小程序的页面栈及路 ...

  8. 054——VUE中vue-router之实例讲解定义一下单页面路由

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. vue2.0路由写法、传参和嵌套

    前置知识请戳这里 vue-routerCDN地址:https://unpkg.com/vue-router@3.0.1/dist/vue-router.js vue-router下载地址:https: ...

随机推荐

  1. mongodb安装教程(一)

    版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/fengtingYan/article/de ...

  2. List<String>转List<Integer>

    List<Integer> intList = strList.stream().map(Integer::parseInt).collect(Collectors.toList()); ...

  3. Linux usb 1. 总线简介

    文章目录 1. USB 发展历史 1.1 USB 1.0/2.0 1.2 USB 3.0 1.3 速度识别 1.4 OTG 1.5 phy 总线 1.6 传输编码方式 2. 总线拓扑 2.1 Devi ...

  4. grafan源码编译

    下载grafana源码:https://github.com/grafana/grafana 前端: 安装node.js,安装完自带npmnpm install -g yarnyarn install ...

  5. celery tasks always in pending

    Result backend doesn't work or tasks are always in PENDING state¶All tasks are PENDING by default, s ...

  6. Spring Boot程序中@JsonIgnoreProperties与@JsonIgnore基本使用

    问题由来: springboot项目中定义了很多类,我们在rest返回中直接返回或者在返回对象中使用这些类,spring已经使用jackson自动帮我们完成这些的to json.但是有时候自动转的js ...

  7. List<Object>

    ... package str; import java.util.ArrayList; import java.util.List; public class arrayText { public ...

  8. 回顾Servlet开发

    1.建立的文件 2.servlet package com.shao.servlet; import javax.servlet.ServletException; import javax.serv ...

  9. Revit二次开发之获取本机已安装的Revit版本与路径

    在revit安装目录下找到 RevitAddInUtility.dll 在项目中引用 使用以下方法 using Autodesk.RevitAddIns; /// <summary> // ...

  10. 我的获奖记录及 Important Dates in OI

    逊逊的获奖记录/ruo(真的没拿过啥奖,并且大部分都集中在初三阶段,即 2020-2021 赛季): NOIP2018 pj,1=,无游记 CSP-S2019,1=,无游记 APIO2020,Ag,游 ...