1、在主组件展示二级路由的组件内容,在App.vue中添加

<br>
<div class="container">
<!-- row 行排列 -->
<div class="row">
<!-- 小屏展示12列,中屏展示4列 -->
<div class="col-sm-12 col-md-4">
<router-view name="orderingGuide"></router-view>
</div>
<div class="col-sm-12 col-md-4">
<router-view name="delivery"></router-view>
</div>
<div class="col-sm-12 col-md-4">
<router-view name="history"></router-view>
</div>
</div>
</div>

2、在index.js中修改路由配置

{path: '/', name: 'homeLink', components:{
default:Home,
'orderingGuide':OderingGuide,
'delivery':Delivery,
'history':History
}},

  

 

vue项目1-pizza点餐系统6-路由精讲之复用router-view的更多相关文章

  1. 一 创建一个springboot项目之(微信点餐系统的设计与开发)

    第一步:收到项目需求,进行数据库表的设计. 1.角色的划分: 卖家:  订单,类目 买家:  商品列表 2.功能模块的划分: 商品:商品列表 订单:  订单创建,订单查询,订单取消 类目:基于管理的功 ...

  2. vue项目获取当前地址栏参数(非路由传参)

    项目中遇到一个需求,就是另一个管理系统带参直接单纯的跳转跳转到vue pc项目中的某个页面,后再初始化查询数据,参数以地址栏的形式传入 管理系统:打开新地址地址 let obj = { id: 21, ...

  3. vue项目1-pizza点餐系统1-利用bootstrap4制作导航栏

    初次接触Bootstrap,简单谈一下理解.bootstrap是一个简单有强悍的前端框架,它是一个开源项目.当我们需要一些样式等,可以了解bootstrap的相关class.标签名称等所代表的意思,然 ...

  4. 基于SpringBoot前后端分离的点餐系统

    基于SpringBoot前后端分离的点餐系统 开发环境:主要采用Spring boot框架和小程序开发 项目简介:点餐系统,分成卖家端和买家端.买家端使用微信小程序开发,实现扫码点餐.浏览菜单.下单. ...

  5. vue 项目中当访问路由不存在的时候默认访问404页面

    前言: 在Vue项目中,当访问的页面路由不存在或错误时,页面显示为一片空白.然而,通常我们需要对访问url不存在或者错误的情况下添加默认的404页面,即not found页面. 一般的处理方法是: 在 ...

  6. Cordova打包vue项目生成Apk (解决cordova build android抛出的zip问题)

    最近对vue前端框架情有独钟.但研究了一下怎么把vue项目打包成android apk来玩玩. 首先讲一下创建vue2.x项目.其实在之前的文章中都有写过,有兴趣的同学可以去看看.http://www ...

  7. vue项目中的常见问题(vue-cli版本3.0.0)

    一.样式问题 1.vue中使用less 安装less依赖 npm install less less-loader --save-dev 在使用时 在style标签中加入 lang="les ...

  8. [课程设计]Scrum 2.0 多鱼点餐系统开发进度(第二阶段项目构思与任务规划)

    [课程设计]Scrum 2.0 多鱼点餐系统开发进度 1.团队名称:重案组 2.团队目标:长期经营,积累客户充分准备,伺机而行 3.团队口号:矢志不渝,追求完美 4.团队选题:餐厅到店点餐系统WEB ...

  9. [课程设计]Scrum 3.1 多鱼点餐系统开发进度(第三阶段项目构思与任务规划)

    Scrum 3.1 多鱼点餐系统开发进度(第三阶段项目构思与任务规划) 1.团队名称:重案组 2.团队目标:长期经营,积累客户充分准备,伺机而行 3.团队口号:矢志不渝,追求完美 4.团队选题:餐厅到 ...

随机推荐

  1. JMS学习六(ActiveMQ消息传送模型)

    ActiveMQ 支持两种截然不同的消息传送模型:PTP(即点对点模型)和Pub/Sub(即发布 /订阅模型),分别称作:PTP Domain 和Pub/Sub Domain. 一.PTP消息传送模型 ...

  2. SWPUCTF2019 | Network

    这题真的就靠百度的,第一次接触TTL型的misc,直接拿了一个大佬的脚本,改了一丢丢: with open('t.txt') as f: lines = f.readlines() n_num = [ ...

  3. linux 文本文件显示行数

    一般的我们在使用linux编辑器编辑文本文件的时候是不会像其他编程软件一样显示行数 临时方法: 在命令模式下输入:set nu或者:set number都可以为vi设置行号,如果要取消的话,则输入:s ...

  4. spring boot shiro redis整合基于角色和权限的安全管理-Java编程

    一.概述 本博客主要讲解spring boot整合Apache的shiro框架,实现基于角色的安全访问控制或者基于权限的访问安全控制,其中还使用到分布式缓存redis进行用户认证信息的缓存,减少数据库 ...

  5. leetcode-mid-math -171. Excel Sheet Column Number

    mycode   90.39% class Solution(object): def titleToNumber(self, s): """ :type s: str ...

  6. 十、Springboot之thymeleaf与jsp共存

    : pom.xml添加依赖 <!--thymeleaf整合JSP需要用到下面的依赖--> <dependency> <groupId>org.thymeleaf&l ...

  7. deepfm代码参考

    https://github.com/lambdaji/tf_repos/blob/master/deep_ctr/Model_pipeline/DeepFM.py https://www.cnblo ...

  8. Openstack_通用模块_Oslo_vmware 创建 vSS PortGroup

    目录 目录 vSS vSSPG vSphere SDK 中相关的网络对象 创建 vSS PortGroup vSS & vSSPG vSS(Standard vSwitch 标准交换机) 为在 ...

  9. Delphi 快速检测是否联网 判断网线是否拔开。 但是不能判断是否能上网

    https://blog.csdn.net/chelen_jak/article/details/50204145 Delphi 快速检测是否联网 2015年12月07日 12:01:26 chele ...

  10. 判断Ctrl Shift Alt 键当前是否被按下

    Control.ModifierKeys.HasFlag(Keys.Shift) 以此类推