主要是构建 SPA (单页应用) 时,方便渲染你指定路由对应的组件。你可以 router-view 当做是一个容器,它渲染的组件是你使用 vue-router 指定的。比如:

视图层:

<div id="app">
<router-view></router-view>
</div>

路由定义:

router.map({
'/foo': {
// 路由匹配到/foo时,会渲染一个Foo组件
component: Foo
}
})

初始化实例:

// start app
var App = Vue.extend({})
router.start(App, '#app')

当你访问 /foo 时,router-view 就被 Foo 组件替换了。

组件的嵌套,一样的逻辑,看下文档和demo吧。 嵌套路由

转 router-view 的理解的更多相关文章

  1. vue项目过程的理解: main.js文件理解 router.js文件理解 以及组件 路由 等之间的关系

    https://blog.csdn.net/qq_26229005/article/details/85040393 内容太多了,有空再整理

  2. 理解OpenShift(1):网络之 Router 和 Route

    理解OpenShift(1):网络之 Router 和 Route 理解OpenShift(2):网络之 DNS(域名服务) 理解OpenShift(3):网络之 SDN 理解OpenShift(4) ...

  3. 【原创】ui.router源码解析

    Angular系列文章之angular路由 路由(route),几乎所有的MVC(VM)框架都应该具有的特性,因为它是前端构建单页面应用(SPA)必不可少的组成部分. 那么,对于angular而言,它 ...

  4. 理解OpenShift(4):用户及权限管理

    理解OpenShift(1):网络之 Router 和 Route 理解OpenShift(2):网络之 DNS(域名服务) 理解OpenShift(3):网络之 SDN 理解OpenShift(4) ...

  5. [diango]理解django视图工作原理

    前言:正确理解django视图view,模型model,模板的概念及其之间的关联关系,才能快速学习并上手使用django制作网页 本文主要讲解自己在学习django后对视图view的理解 在进入正文之 ...

  6. Android 自定义view(二) —— attr 使用

    前言: attr 在前一篇文章<Android 自定义view -- attr理解>已经简单的进行了介绍和创建,那么这篇文章就来一步步说说attr的简单使用吧 自定义view简单实现步骤 ...

  7. Android自定义View的实现方法,带你一步步深入了解View(四)

    转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/17357967 不知不觉中,带你一步步深入了解View系列的文章已经写到第四篇了,回 ...

  8. Android视图状态及重绘流程分析,带你一步步深入了解View(三)

    转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/17045157 在前面一篇文章中,我带着大家一起从源码的层面上分析了视图的绘制流程, ...

  9. Android视图绘制流程完全解析,带你一步步深入了解View(二)

    转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/16330267 在上一篇文章中,我带着大家一起剖析了一下LayoutInflater ...

  10. 【转】Android自定义View的实现方法,带你一步步深入了解View(四)

    原文网址: 转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/17357967 不知不觉中,带你一步步深入了解View系列的文章已经写到 ...

随机推荐

  1. ideamaven版的MBG逆向工程

    一.简介 简称MBG,是一个专门为MyBatis框架使用者定制的代码生成器,可以快速的根据表生成对应的映射文件,接口,以及bean类. 支持基本的增删改查,以及QBC风格的条件查询. 但是表连接.存储 ...

  2. 线上nginx 平滑添加新模块;如(--with-http_realip_module)

    nginx 添加模块1.查看当前nginx信息(配置文件路径,启动用户...) ps aux | grep nginx 2.查看当前nginx已启用的模块(记录模块信息,安装路径)./nginx -V ...

  3. MYSQL学习笔记——数据类型

    mysql的数据类型可以分为三大类,分别是数值数据类型.字符串数据类型以及日期时间数据类型. 数值数据类型                                               ...

  4. Spring---Spring Integration

    1.概述 1.1.Spring Integration  提供了  基于spring  的 EIP(Enterprise Integration Patterns,企业集成模式)的实现: 1.2.Sp ...

  5. UI定位元素大全(跟App定位元素差不多哦)

    selenium+python自动化之元素定位 作者:一飞冲天 同样的道理,把一个页面上的元素当成是一个对象(你的女神),我们就可以通过她的属性值来找到她,比如她性别女爱好爬山---------你就可 ...

  6. Django2 + ORM 做一个简单的登陆

    . ├── db.sqlite3 ├── manage.py ├── myormLogin │   ├── __init__.py │   ├── __pycache__ │   │   ├── __ ...

  7. 状态管理Vuex的使用总结

    1.Vuex.store 的基本使用 Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式,它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化. Vu ...

  8. 回归平方和 ESS,残差平方和 RSS,总体平方和 TSS

    https://zhidao.baidu.com/question/565190261749684764.html 回归平方和 ESS,残差平方和 RSS,总体平方和 TSS   总变差       ...

  9. 【HDOJ6641】TDL(数论)

    题意:定义f(n,m)是第m小的数字x,使得x>n且gcd(x,n)=1 已知 求最小的n使得 k<=1e18,m<=1e2 思路: #include<bits/stdc++. ...

  10. Hash树——数据结构