本文地址:http://www.cnblogs.com/veinyin/p/7911292.html

最近学完了基础课程,打算整理一波笔记,对基本概念梳理一遍,惊觉对子路由和单页面多路由混淆的一塌糊涂。

果然,基础课程的坑新手是体会不到的。

由于子路由仅嵌套了一层,多路由给了左右两个组件,而且两个都是在默认组件下进行的。于是,妥妥误会俩作用一样。我发现自己问题,并尝试网上找到区别时,发现并没有人写出来。只好去官网看了一下文档。

哇塞,真是一语惊醒梦中人啊!!!

上面就是官网对子路由的解释,人家说的很清楚了,嵌套路由!!!是一层层嵌套的!!!

再看看传说中的多路由是啥

嗯,也不叫多路由,而是叫命名视图,上面写着要 “ 同时展示多个视图,而不是嵌套展示 ” ,瞬间醍醐灌顶有没有,区别一下子讲的清清楚楚明明白白,传说的多路由就是放多个平级的视图进行展示,而子路由则是嵌套路由,是一层层嵌套展示的。

不懂还是要看文档,别上网到处查,文档写的还是比较清楚的

END~~~≥ω≤

Vue 子路由 与 单页面多路由 的区别的更多相关文章

  1. vue-router(配置子路由--单页面多路由区域操作)

    1.配置子路由: import Post from "@components/Post" export default new Router({ routers:[ { path: ...

  2. 使用react-router实现单页面应用路由

    这是Webpack+React系列配置过程记录的第二篇.其他内容请参考: 第一篇:使用webpack.babel.react.antdesign配置单页面应用开发环境 第二篇:使用react-rout ...

  3. nignx部署Vue单页面刷新路由404问题解决

    官网说明: https://router.vuejs.org/zh/guide/essentials/history-mode.html#%E8%AD%A6%E5%91%8A 在linux下搭建ngi ...

  4. Angular——单页面与路由的使用

    单页面 SPA(Single Page Application)指的是通单一页面展示所有功能,通过Ajax动态获取数据然后进行实时渲染,结合CSS3动画模仿原生App交互,然后再进行打包(使用工具把W ...

  5. 用 vue cli 脚手架搭建单页面 Vue 应用(进阶2)

    1.配置 Node 环境. 自行百度吧. 安装好了之后,打开 cmd .运行 node -v .显示版本号,就是安装成功了. 注:不要安装8.0.0以上的版本,和 vue-cli 不兼容. 我使用的 ...

  6. vue环境搭建及单页面标签切换实例

    复习 """ 1.指令: v-once: <p v-once>{{ msg }}</p> v-cloak: 防止页面加载抖动 v-show:绑定的 ...

  7. webpack配合vue.js实现完整的单页面demo

    本篇文章主要是我在开发前研究了webpack+vue.js的单页面应用,因为需要用到node的npm,所以确保安装了node,建议官网安装最新的稳定版本.并且在项目中需要加载一些npm包,由于npm的 ...

  8. 处理 Vue 单页面应用 SEO 的另一种思路

    vue-meta-info 官方地址: monkeyWangs/vue-meta-info (设置vue 单页面meta info信息,如果需要单页面SEO,可以和 prerender-spa-plu ...

  9. 移动H5页面微信支付踩坑之旅(微信支付、单页面路由模拟、按钮加锁、轮询等常见功能)

    开发背景: .net混合开发的vue模板语法的单页面应用,所以不存在脚手架以及没有路由可以跳转. 项目描述: 需要写两个页面,在订单详情页需要点击“请输入手机号”进入手机号绑定页面,手机号绑定成功后自 ...

随机推荐

  1. golang中的检验hash

    1.对字符串进行hash 大家可以看一下, SHA1 Hashes Go by Example写道: The pattern for generating a hash is sha1.New(), ...

  2. vim 末行模式简单练习

    练习 1 . 复制/etc/grub2.cfg文件至/tmp目录中,用查找替换命令删除/tmp/grub2.cfg文件中以空白字符开头的行的行首的空白字符 :%s#^[[:space:]]\+##g ...

  3. Struts2文件的上传和下载实现

    <一>简述: Struts2的文件上传其实也是通过拦截器来实现的,只是该拦截器定义为默认拦截器了,所以不用自己去手工配置,<interceptor name="fileUp ...

  4. ZOJ2290_Game

    题目意思是这样的,给定一个数N,第一个可以减去任意一个数(不能为N本身),然后接下来轮流减去一个数字,下一个人减去的数字必须大于0,且不大于2倍上一次被减去的数字. 把N减为0的人获胜. 看完题目后不 ...

  5. robot framework Selenium2关键字介绍

    *** Settings *** Library Selenium2Library *** Keywords *** Checkbox应该不被选择 [Arguments] ${locator} Che ...

  6. Contest 1

    A:注意到模数是要求lcm的数的倍数,直接先取模就可以了.考场脑抽,对其质因数分解判了一下每个因子有没有,当然也行. #include<iostream> #include<cstd ...

  7. 洛谷 P4116 Qtree3

    Qtree系列第三题 我是题面 读完题大概不难判断是一道树剖的题 这道题的关键是记录两种状态,以及黑点的序号(不是编号) 线段树啊当然 定义两个变量v,f,v表示距离根节点最近的黑点,默认-1,f则表 ...

  8. pycharm中新建并且运行django

    1.对于Bottle框架其本身未实现类似于Tornado自己基于socket实现Web服务,所以必须依赖WSGI,默认Bottle已经实现并且支持的WSGI有: 帮助我们写socket的server. ...

  9. a++ 和 ++a 的区别

    a++ 和 ++a 的区别 1)首先说左值和右值的定义:        变量和文字常量都有存储区,并且有相关的类型.区别在于变量是可寻址的(addressable)对于每一个变量都有两个值与其相联:  ...

  10. 纪念一个日子QAQ

    嗯事情是这样的 今天早上考试的时候不知道为什么特别累,精神并不是很好,T1半平面交裸题  T2当时没有仔细看题,T3想了一段时间后会正解(9:30),但是好像很难写的样子啊.. 但是似乎由于模拟考并不 ...