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. hdu_3466(01背包)

    其实,就是让C商品的q不等于p,其他都相同,这时,你就会发现如果要买C商品的话,肯定得先买C商品,因为买C商品的代价最大.所以,我们可以按照qi-pi的顺序来确定大顺序.这里我们还可以用更严谨的方式来 ...

  2. sh_08_石头剪刀布

    sh_08_石头剪刀布 # 导入随机工具包 # 注意:在导入工具包的时候,应该将导入的语句,放在文件的顶部 # 因为,这样可以方便下方的代码,在任何需要的时候,使用工具包中的工具 import ran ...

  3. 【转】毛虫算法——尺取法

    转自http://www.myexception.cn/program/1839999.html 妹子满分~~~~ 毛毛虫算法--尺取法 有这么一类问题,需要在给的一组数据中找到不大于某一个上限的&q ...

  4. maven 高级玩法

    maven 高级玩法 标签(空格分隔): maven 实用技巧 Maven 提速 多线程 # 用 4 个线程构建,以及根据 CPU 核数每个核分配 1 个线程进行构建 $ mvn -T 4 clean ...

  5. 一、Spring MVC起步——IntelliJ IDEA 搭建Spring MVC环境(手把手搭建)

    本机环境: JDK 1.7 IntelliJ IDEA 2017.2 1.新建项目 Create New Project ​ 选择Spring MVC ​ 填写项目名和项目存放位置 ​ 然后点击Fin ...

  6. android 对话框显示工具类

    这个工具类非常简单,但是将显示dialog的方法统一封装,能够大大减少代码重复 package com.ctbri.weather.utils; import android.app.AlertDia ...

  7. autoprefixer不起作用的坑

    概述 今天同事说,nuxt.js的项目好像没有自动加前缀,我花了很长时间查找原因,最后终于发现,原来是没有加.browserslistrc文件...记录下来,供以后开发时参考,相信对其他人也有用. b ...

  8. 禁止SYS和SYSTEM用户远程登录Oracle oracle的sys和system默认密码

    alter system set remote_login_passwordfile=none scope=spfile; system默认:manager sys默认:change_on_insta ...

  9. CSS3——分组和嵌套 尺寸 display显示 position定位 overflow float浮动

    分组和嵌套  分组选择器 ——————>   嵌套选择器 能适用于选择器内部的选择器的样式 p{ }: 为所有 p 元素指定一个样式. .marked{ }: 为所有 class="m ...

  10. 安装docker-下载加速、失败、成功安装

    前提:已装VMware虚拟机和Centos系统(具体安装包和过程可以百度) 先看这里:非root身份登录系统需要在下面的命令前加“sudo ”(sudo:代表给权限,用root登录则不需要输入) 一. ...