vue-router的新奇写法
加班中。。。。。。。。。。。。。。。。。。。。。。。。。。。
我们以前写路由是下面这样的
这导致了页面一多,我们的路由文件内容就比较多,不好看。
下面我为大家介绍一下,新的一种写法
这种写法,我们只需定义一个根目录,然后通过全局组件,通过正则匹配组件名替换组件就好了,这使得router文件不需要写很多东西。
以上两种写法都可以,第一种写法的好处是,不管谁接手这个项目,都可以清楚的找到页面路由,便于后期维护。
第二种写法虽然可以,但是有个缺点就是,后期维护,别人接手的话,是找不到组件的
vue-router的新奇写法的更多相关文章
- 「进阶篇」Vue Router 核心原理解析
前言 此篇为进阶篇,希望读者有 Vue.js,Vue Router 的使用经验,并对 Vue.js 核心原理有简单了解: 不会大篇幅手撕源码,会贴最核心的源码,对应的官方仓库源码地址会放到超上,可以配 ...
- python 全栈开发,Day91(Vue实例的生命周期,组件间通信之中央事件总线bus,Vue Router,vue-cli 工具)
昨日内容回顾 0. 组件注意事项!!! data属性必须是一个函数! 1. 注册全局组件 Vue.component('组件名',{ template: `` }) var app = new Vue ...
- Vue Router的懒加载路径
单页应用产出的入口chunk大小随着业务的复杂度线性增加,导致后期加载速度越来越慢.后面就需要对不同路径下的模块进行拆分,打包到相应的chunk下,按需加载,找到chunk的大小.个数和页面加载速度的 ...
- Vue Router的简单了解
Vue Router Vue Router官方文档 传统Web项目开发往往采用超链接实现页面之间的切换和跳转.Vue开发的是单页面应用(Single Page Application,SPA),不能使 ...
- Vue 2.0 + Vue Router + Vuex
用 Vue.js 2.x 与相配套的 Vue Router.Vuex 搭建了一个最基本的后台管理系统的骨架. 当然先要安装 node.js(包括了 npm).vue-cli 项目结构如图所示: ass ...
- vue router 只需要这么几步
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- Vue.js 2.x笔记:路由Vue Router(6)
1. Vue Router简介与安装 1.1 Vue Router简介 Vue Router 是 Vue.js 官方的路由管理器.它和 Vue.js 的核心深度集成,构建单页面应用. Vue Rout ...
- Vue Router学习笔记
前端的路由:一个地址对应一个组件 Vue Router中文文档 一.路由基本使用 第1步:导入Vue Router: <script src="https://unpkg.com/vu ...
- vue router.push(),router.replace(),router.go()和router.replace后需要返回两次的问题
转载:https://www.cnblogs.com/lwwen/p/7245083.html https://blog.csdn.net/qq_15385627/article/details/83 ...
- 前端MVC Vue2学习总结(八)——Vue Router路由、Vuex状态管理、Element-UI
一.Vue Router路由 二.Vuex状态管理 三.Element-UI Element-UI是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架,手机端有对应框架是 Mint U ...
随机推荐
- 4. 基本socket函数
一.创建socket /* 创建一个socket */ int socket(int family, int type, int protocol); /* 参数说明 */ // domain:使用哪 ...
- Asphalting Roads(翻译!)
Description City X consists of n vertical and n horizontal infinite roads, forming n × n intersectio ...
- LeetCode 36. Valid Sudoku (C++)
题目: Determine if a 9x9 Sudoku board is valid. Only the filled cells need to be validated according t ...
- plsql 永久注册码
注册码:Product Code:4t46t6vydkvsxekkvf3fjnpzy5wbuhphqzserial Number:601769 password:xs374ca 可用
- Optimized Flow Migration for NFV Elasticity Control
NFV弹性控制中的流迁移优化 ABSTRACT 基于动态创建和移除网络功能实例,NFV在网络功能控制上有很大的弹性.比如,网络功能和并,网络功能拆分,负载均衡等等. 那么为了实现弹性控制,就需要网络流 ...
- 第九章 Mysql函数
简介 数学函数:处理数字 字符串函数:处理字符串 日期和时间函数:处理日期和时间,获取时间 条件判断函数:控制条件选择 系统信息函数:获取MySQL系统信息,包括数据库名称,当前用户名和数据库版本 加 ...
- Maven实现项目构建直接部署Web项目到Tomcat
Maven实现项目构建直接部署Web项目到Tomcat配置如下: 1.Tomcat的用户及权限配置:在conf目录下,找到tomcat-users.xml,添加manager权限的用户. <ro ...
- jQuery之offset,position
获取/设置标签的位置数据 * offset(): 相对页面左上角的坐标 * position(): 相对于父元素左上角的坐标. 需求: 1. 点击 btn1 打印 div1 相对于页面左上角的位置 打 ...
- QMap使用
版权声明:若无来源注明,Techie亮博客文章均为原创. 转载请以链接形式标明本文标题和地址: 本文标题:QMap使用 本文地址:https://www.techieliang.com/201 ...
- 第190天:js---String常用属性和方法(最全)
String常用属性和方法 一.string对象构造函数 /*string对象构造函数*/ console.log('字符串即对象');//字符串即对象 //传统方式 - 背后会自动将其转换成对象 / ...