【移动端】商场项目路由设计

1:路由设计配置:

一级路由配置

分析项目,设计路由,配置一级路由

一级路由:单个页面独立展示的,都是一级路由,例如:登录页面,首页架子,报错页面

二级路由:就是包含在一个组件里面的子组件,例如:首页架子里面有首页,我的,购物车等

分析:main.js加载App.vue组件页面渲染到index.html里面,App.vue组件页面就行构建模板样式,通俗来讲就是App.vue里面有什么内容页面上面就会展示什么内容,但是将所有的内容写到App.vue组件页面中显然太麻烦,然后就出现了路由出口,意思就是我在路由里面配置的页面组件在App.vue组件页面配置了一个路由出口路由切换到到哪个组件页面就把哪个组件里面的内容在App.vue组件页面中展示出来。这一种就是一级路由的展示方式,像登录页面

在实际场景中通常都是有一级路由和二级路由组合进行展示的,例如淘宝的首页架子中里面包含首页组件页面,购物车组件页面,我的组件页面,这种的实现通常搭建自定义一个组件首页架子为一级路由假设是Layout.vue是首页架子,在配置路由时,将使用children将(首页组件页面,购物车组件页面,我的组件页面)配置成二级路由,在Layout.vue中添加一个路由出口意思就是配置的二级路由的组件页面将在Layout这个一级组件中展示出来,一级路由Layout这个组件将在App.vue这个组件出口中展示出来。最终完成一级,二级路由的展示

二级路由的配置:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/846158.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

美业SaaS收银系统源码-已过期卡项需要延期怎么操作?美业系统实操

美业SaaS系统 连锁多门店美业收银系统源码 多门店管理 / 会员管理 / 预约管理 / 排班管理 / 商品管理 / 促销活动 PC管理后台、手机APP、iPad APP、微信小程序 1.询问会员手机号和需要延期的卡项 2.PC运营后端-数据导入-修改已售卡项,搜索手机号 3.把需要卡项选…

深入分析 Android BroadcastReceiver (一)

文章目录 深入分析 Android BroadcastReceiver (一)1. Android BroadcastReceiver 设计说明1.1 BroadcastReceiver 的主要用途 2. BroadcastReceiver 的工作机制2.1 注册 BroadcastReceiver2.1.1 静态注册2.1.2 动态注册 3. BroadcastReceiver 的生命周期4. 实现和使用 Broadca…

C++ | Leetcode C++题解之第125题验证回文串

题目&#xff1a; 题解&#xff1a; class Solution { public:bool isPalindrome(string s) {int n s.size();int left 0, right n - 1;while (left < right) {while (left < right && !isalnum(s[left])) {left;}while (left < right && !isalnu…

三方语言中调用, Go Energy GUI编译的dll动态链接库CEF

如何在其它编程语言中调用energy编译的dll动态链接库&#xff0c;以使用CEF 或 LCL库 Energy是Go语言基于LCL CEF开发的跨平台GUI框架, 具有很容易使用CEF 和 LCL控件库 interface 便利 示例链接 正文 为方便起见使用 python 调用 go energy 编译的dll 准备 系统&#x…

【定时任务知多少, 横跨10余项目,6种实践方式】

工作多年&#xff0c;随着项目的不断研发落地&#xff0c;大大小小做了有10个项目&#xff0c;其中不少涉及到定时任务。今天来盘一下&#xff0c;这些项目中&#xff0c;定时任务的实现方式 。 通过项目的需求场景&#xff0c;可以看出定时任务需要有什么样的功能。 需求 1 …

JavaSE——集合框架二(6/6)-(案例)补充知识:集合的嵌套(需求与分析、问题解决、运行测试)

目录 案例引入 需求与分析 问题解决 运行测试 集合的嵌套 顾名思义&#xff0c;指的是集合中的元素又是一个集合。 本篇通过一个案例对这一知识进行了解&#xff1a; 案例引入 需求与分析 要求在程序中记住如下省份和其对应的城市信息&#xff0c;记录成功后&#xff0…

prometheus的rules配置

说明&#xff1a;本文介绍prometheus中的规则配置&#xff1b; 规则说明 groups:- name: MySQLAlertsrules:- alert: MysqlDownexpr: mysql_up 0for: 0mlabels:severity: criticalannotations:summary: MySQL down (实例&#xff1a;{{ $labels.instance }})description: &q…

VMware Workstation中WinXP联网问题

我一直以为我的虚拟机上的XP没有联网 因为 蒙了半天&#xff0c;发现是因为这个网址打不开&#xff0c;不是没有网 太傻了 不如在cmd命令行中通过ping baidu.com来判断是否联网

【康耐视国产案例】Nvidia/算能+智能AI相机:用AI驱动 | 降低电动车成本的未来之路

受环保观念影响、政府激励措施推动与新能源技术的发展&#xff0c;消费者对电动汽车(EV)的需求正在不断增长&#xff0c;电动汽车已经成为了未来出行方式的重要组成部分。然而&#xff0c;电动汽车大规模取代燃油汽车的道路还很漫长。最大的障碍就是电动汽车的售价相对过高。尽…

【Python面试50题】

1. **基础概念** 1. Python 是解释型还是编译型语言&#xff1f; 2. 什么是 Python 的 GIL&#xff08;全局解释器锁&#xff09;&#xff1f; 3. 如何理解 Python 中的可变与不可变数据类型&#xff1f; 4. 解释一下 Python 中的 pass 语句。 5. Python 中的列…

基于昇腾910B训练万亿参数的语言模型简介

基于昇腾910B训练万亿参数的语言模型 Abstract 在本工作中&#xff0c;作者开发了一个系统&#xff0c;该系统在Ascend 910 AI处理器集群和MindSpore框架上训练了一个万亿参数的语言模型&#xff0c;并提出了一个含有1.085T参数的语言模型&#xff0c;名为PanGu-。 从PanGu-[…

3.基础光照

从宏观上讲渲染包含了两大部分&#xff1a;决定一个像素的可见性&#xff0c;决定一个像素的光照计算 而光照模型就是用于决定在一个像素上决定怎样的渲染光照计算。 一、我们是如何看到这个世界的 1.光源 实时渲染中&#xff0c;我们通常把光源当成一个没有体积的点&#…

远程服务器上,再次配笔记1、2、11、12相同的深度学习和gcc环境

文章目录 参考文献 创建环境在(zgp_m3dm)中安装会显示zgp_m3dm_main环境中的情况满足(base) ~/zgp/M3DM-repetition conda deactivate 再次安装如果服务器本身不能联网&#xff0c;需下载pysocks包以设置反向代理&#xff08;具体可参考之前的笔记10&#xff09;&#xff1a; 再…

简易版本的QFD质量屋

比如餐馆要考虑什么因素最重要&#xff0c;这里列出好吃&#xff0c;快速&#xff0c;便宜三类问题&#xff0c;然后设置上图的权重&#xff0c; 然后设置9&#xff0c;3&#xff0c;1三类因子&#xff0c;9比如是最重要的&#xff0c;3&#xff0c;1&#xff0c;依次没那么重要…

[vue2项目]vue2+supermap[mapboxgl]+天地图之地图的初始化

Supermap参考教程 天地图 一、安装 1、终端:npm install supermap/vue-iclient-mapboxgl 2、在package.json文件的dependencies查看supermap/vue-iclient-mapboxgl依赖是否安装成功。 3、在mian.js全局引入 import VueiClient from supermap/vue-iclient-mapboxgl; Vue.use(…

牛客网刷题 | BC106 K形图案

目前主要分为三个专栏&#xff0c;后续还会添加&#xff1a; 专栏如下&#xff1a; C语言刷题解析 C语言系列文章 我的成长经历 感谢阅读&#xff01; 初来乍到&#xff0c;如有错误请指出&#xff0c;感谢&#xff01; 描述 KiKi学习了循环&am…

WPS部分快捷操作汇总

记录一些个人常用的WPS快捷操作 一、去除文档中所有的超链接&#xff1a; 1、用WPS打开文档&#xff1b; 2、用Ctrla全选&#xff0c;或者点击上方的【选择】-【全选】&#xff0c;选中文档全部内容&#xff1b; 3、按CTRLSHIFTF9组合键&#xff0c;即可一次性将取文档中所有…

Linux的程序管理2:设置优先级,程序的查看与处理---ps命令详解与kill,killall,top,renice,nice搭配使用管理linux

前言 程序的管理除了前文说到的前后台执行&#xff0c;离线执行。还包括下面几个方面&#xff1a; 1&#xff1a;如何找到最耗费系统资源的程序&#xff1f; &#xff08;使用top命令找到PID然后排查原因&#xff09; 2&#xff1a;设置程序的优先级&#xff0c;让其被执行的概…

“论软件的可靠性评价”必过范文,突击2024软考高项论文

论文部分 摘要 2023年03月&#xff0c;我参与了某艺术品公司线上拍卖管理平台的研发。该项目的目标是建立一个互联网在线拍卖平台&#xff0c;用户可以通过手机或PC浏览器进入拍卖平台&#xff0c;对喜欢的拍品进行参拍出价。平台提供了在线支付、在线出价、保证金管理、拍品…

Android开机动画的结束过程BootAnimation(基于Android10.0.0-r41)

文章目录 Android 开机动画的结束过程BootAnimation(基于Android10.0.0-r41) Android 开机动画的结束过程BootAnimation(基于Android10.0.0-r41) 路径frameworks/base/cmds/bootanimation/bootanimation_main.cpp init进程把我们的BootAnimation的二进制文件拉起来了&#xf…