【vue2配置】Vue Router

Vue Router官网
1、npm install vue-router@4
2、创建模块,在src目录小创/views/map/MapIndex.vue模块和创router/index.js文件
在这里插入图片描述
3、在router/index.js配置路由

import Vue from "vue";
import Router from "vue-router";
// 引入模块
const MapIndex = () => import("@/views/map/MapIndex.vue");
// 安装路由
Vue.use(Router);
// 创建路由实例
const router = new Router({// 创建路由对象routes: [{path: "/",// 重定项redirect: "/mapIndex",},{path: "/mapIndex",component: MapIndex,},]
});
/* 因为要挂载导航守卫 所以不能实时导出 */
export default router;

4、在main.js导入router
在这里插入图片描述5、App.vue调用
在这里插入图片描述

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

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

相关文章

智慧校园建设的进阶之路

智慧校园的建设现已到达了老练的阶段,许多学校设备充满着数字化信息,进出宿舍楼,校园一卡通体系会记载下学生信息,外来人员闯入会报警,翻开电脑就能查到学生是否在宿舍等……学生的学习和日子都充满了数字化的痕迹。但…

光速入门python的OpenCV

前言 欢迎来到我的博客 个人主页:北岭敲键盘的荒漠猫-CSDN博客 本文整理python的OpenCV模块的关键知识点 争取用最短的时间入门OpenCV 并且做到笔记功能直接复制使用 OpenCV简介 不浪费时间的介绍: 就是类似于ps操作图片。 至于为什么不直接用ps,因为只有程序能…

【找出满足差值条件的下标 I】python

目录 暴力题解 优化:滑动窗口维护大小值 暴力题解 class Solution:def findIndices(self, nums: List[int], indexDifference: int, valueDifference: int) -> List[int]:nlen(nums)for i in range(n):for j in range(n-1,-1,-1):if abs(i-j)>indexDiffere…

海康威视NVR通过ehome协议接入视频监控平台,视频浏览显示3011超时错误的问题解决,即:The request timeout! 【3011】

目录 一、问题描述 二、问题分析 2.1 初步分析 2.2 查看日志 2.3 问题验证 1、查看防火墙 2、查看安全组 3、问题原因 三、问题解决 3.1 防火墙开放相关端口 3.2 安全组增加规则 3.3 测试 1、TCP端口能够联通的情况 2、TCP端口不能够联通的情况 四、验证 五、云…

「51媒体」如何与媒体建立良好关系?

传媒如春雨,润物细无声,大家好,我是51媒体网胡老师。 与媒体建立良好关系对于企业或个人来说都是一项重要的公关活动。 了解媒体:研究媒体和记者的兴趣,提供相关且有价值的信息。 建立联系:通过专业的方式…

牛客NC324 下一个更大的数(三)【中等 双指针 Java/Go/PHP/C++】参考lintcode 52 · 下一个排列

题目 题目链接: https://www.nowcoder.com/practice/475da0d4e37a481bacf9a09b5a059199 思路 第一步:获取数字上每一个数,组成数组arr 第二步:利用“下一个排列” 问题解题方法来继续作答,步骤:利用lintc…

C++进阶之路:何为拷贝构造函数,深入理解浅拷贝与深拷贝(类与对象_中篇)

✨✨ 欢迎大家来访Srlua的博文(づ ̄3 ̄)づ╭❤~✨✨ 🌟🌟 欢迎各位亲爱的读者,感谢你们抽出宝贵的时间来阅读我的文章。 我是Srlua小谢,在这里我会分享我的知识和经验。&am…

PostgreSQL基础(三):PostgreSQL的基础操作

文章目录 PostgreSQL的基础操作 一、用户操作 二、权限操作 三、操作任务

解决CLion调试时无法显示变量值的问题

1 问题描述 使用CLion的时候,调试时无法显示变量的值,例如: 图来自StackOverflow。 2 解决办法 可以尝试切换调试器解决,在Linux下,CLion支持GDB和LLDB,如果GDB不行,可以切换到LLDB。 切换方…

软件杯 题目: 基于深度学习的疲劳驾驶检测 深度学习

文章目录 0 前言1 课题背景2 实现目标3 当前市面上疲劳驾驶检测的方法4 相关数据集5 基于头部姿态的驾驶疲劳检测5.1 如何确定疲劳状态5.2 算法步骤5.3 打瞌睡判断 6 基于CNN与SVM的疲劳检测方法6.1 网络结构6.2 疲劳图像分类训练6.3 训练结果 7 最后 0 前言 🔥 优…

为什么单片机不能直接驱动继电器和电磁阀

文章是瑞生网转载,PDF格式文章下载: 为什么单片机不能直接驱动继电器和电磁阀.pdf: https://url83.ctfile.com/f/45573183-1247189072-10b6d1?p7526 (访问密码: 7526)

Science 基于尖峰时序编码的模拟神经触觉系统,可实现动态对象分类

快速处理和有效利用手与物体交互过程中产生的动态触觉信号(例如触摸和抓握)对于触觉探索和灵巧的物体操作至关重要。将电子皮肤(e-skins)推进到模仿自然触觉的水平,是恢复截肢者和瘫痪患者丧失的功能的可行解决方案&am…

实现地图上展示坐标时,不要全部展示、只展示几个距离相对较大marker点位,随着地图放大再全部展示出来。

比例尺级别地面分辨率 (米/像素)比例尺0156543.031:591658700.82178271.5151:295829350.4239135.75751:147914675.2319567.878751:73957337.649783.9393751:36978668.854891.9696881&#xff1a…

电机控制系列模块解析(22)—— 零矢量刹车

一、零矢量刹车 基本概念 逆变器通常采用三相桥式结构,包含六个功率开关元件(如IGBT或MOSFET),分为上桥臂和下桥臂。每个桥臂由两个反并联的开关元件组成,上桥臂和下桥臂对应于电机三相绕组的正负端。正常工作时&…

【C++题解】1699 - 输出是2的倍数,但非3的倍数的数

问题:1699 - 输出是2的倍数,但非3的倍数的数 类型:循环 题目描述: 请从键盘读入一个整数 n,输出 1∼n 中所有是 2 的倍数,但非 3 的倍数的数,每行 1个。 比如,读入一个整数10 &…

Spring AI实战之二:Chat API基础知识大串讲(重要)

欢迎访问我的GitHub 这里分类和汇总了欣宸的全部原创(含配套源码):https://github.com/zq2599/blog_demos Spring AI实战全系列链接 Spring AI实战之一:快速体验(OpenAI)Spring AI实战之二:Chat API基础知识大串讲(重要)SpringAIOllama三部曲…

Linux:进程地址空间、进程控制(一.进程创建、进程终止、进程等待)

上次介绍了环境变量:Linux:进程概念(四.main函数的参数、环境变量及其相关操作) 文章目录 1.程序地址空间知识点总结上述空间排布结构是在内存吗?(进程地址空间引入) 2.进程地址空间明确几个点进…

NDIS小端口驱动开发(三)

微型端口驱动程序处理来自过度驱动程序的发送请求,并发出接收指示。 在单个函数调用中,NDIS 微型端口驱动程序可以指示具有多个接收 NET_BUFFER_LIST 结构的链接列表。 微型端口驱动程序可以处理对每个NET_BUFFER_LIST结构上具有多个 NET_BUFFER 结构的多…

JAVA -- > 初识JAVA

初始JAVA 第一个JAVA程序详解 public class Main {public static void main(String[] args) {System.out.println("Hello world");} }1.public class Main: 类型,作为被public修饰的类,必须与文件名一致 2.public static 是JAVA中main函数准写法,记住该格式即可 …

Slash后台管理系统代码阅读笔记 如何实现环形统计图表卡片?

目前&#xff0c;工作台界面的上半部分已经基本梳理完毕了。 接下来&#xff0c;我们看看这个环形图卡片是怎么实现的&#xff1f; 具体代码如下&#xff1a; {/*图表卡片*/} <Row gutter{[16, 16]} className"mt-4" justify"center">{/*环形图表…