this.$route： 当前激活的路由的信息对象。每个对象都是局部的，可以获取当前路由的 path, name, params, query 等属性。 this.$router：全局的 router 实例。通过 Vue 根实例中注入 router 实例，然后再注入到每个子组件，从而让整个应用都有路由功能。其中包含了很多属性和对象（比如 history 对象），任何页面也都可以调用其 push(

语法123router.addRoutes([路由配置对象])// 或者this.$router.addRoutes([路由配置对象]) Vue-router 的动态添加子路由的注意事项 格式必须为数组的形式。 addRoutes添加的路由必须为一级路由。 切莫用JSON方法深copy路由对象 把动态的路由也添加到 $router.options.routes 里 1. 格式必须为数组的形式

动态路由实现方式前端控制 不用后端帮助，路由表维护在前端 逻辑相对比较简单，比较容易上手 后端控制 相对更安全一点 路由表维护在数据库 一、前端控制思路：在路由配置里，通过meta属性，扩展权限相关的字段，在路由守卫里通过判断这个权限标识，实现路由的动态增加，及页面跳转；如：我们增加一个role字段来控制角色 具体方案： 根据登录用户的账号，返回前端用户的角色 前端根据用户的角色，跟

Vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。这里有很多方式植入路由导航中：全局的，单个路由独享的，或者组件级的。 全局前置守卫 router.beforeEach使用场景: 跳转前需要做校验的地方，如：进入首页前做登录校验，如果已登录则跳转首页，否则跳转登录页。需要写在main.js文件中，表示在所有路由被访问之前做校验； 动态生成路由，在访问之前动态获取路由信息并

前端路由概念通过改变 URL，在不重新请求页面的情况下，更新页面视图。 vue-Router 两种模式更新视图但不重新请求页面，是前端路由原理的核心之一，目前在浏览器环境中这一功能的实现主要有 2 种方式： Hash：默认值，利用 URL 中的hash(“#”) http://localhost:8080/#/login history：利用URL中的路径（/home） http://

拦截器简介顾名思义，拦截器主要是拦截，放到 Vue 里面指对 Vue 发出的 http 请求和响应进行拦截，并可以对拦截的请求或响应做一些特殊的处理 拦截器能做的 添加统一的request的参数 比如header中加入 X-Requested-With，比如客户端需要实现sign和token的验证机制，比如你可以写 $http.get('/files', params)，拦截器帮

官网地址：http://www.axios-js.com/zh-cn/docs 什么是 axios？Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。 特性 从浏览器中创建 XMLHttpRequests 从 node.js 创建 http 请求 支持 Promise API 拦截请求和响应 转换请求数据和响应数据 取消请求 自动转换 JSON 数

1、前期准备 检查 node 是否安装 检查 npm 是否安装 12npm -vnode -v 2、设置国内源，这样你的下载速度会非常快：1234npm config set registry https://registry.npm.taobao.org// 查看源npm config list 3、安装 vue 和一些相关组件1234npm install @vue/cli -g//

vue-config-js 官网简介 vue.config.js 简介vue-cli 脚手架搭建完成后，项目目录中没有 vue.config.js 文件，需要手动创建。 vue.config.js 是一个可选的配置文件，如果项目的根目录(和 package.json 同级)中存在这个文件，那么它会被 @vue/cli-service 自动加载。你也可以使用 package.json 中的

1、element-UI 中如何获取当前行数据？123456<el-table-column prop label="操作"> <template slot-scope="scope"> <span class="edit"></span> <span class="delete" @click.prevent="deleteRo

0、简介ES6 新增了模块功能，其中主要有两个：export和import export 用于对外输出本模块（一个文件可以理解为一个模块）变量的接口。可以导出常量、函数、文件、模块等。 import 用于在一个模块中加载另一个含有export接口的模块。 也就是说使用export命令定义了模块的对外接口以后，其他JS文件就可以通过import命令加载这个模块（文件）。 前端 JS 模块化对外暴

import...from... 加载顺序import...from... 的from命令后面可以跟很多路径格式： 若只给出 vue，axios，less 这样的包名，则会自动到 node_modules 中查到，找到后则加载； 若给出相对路径及文件前缀，则到指定位置寻找； 如果是文件，则加载文件 如果是文件夹，则先加载 index.js ,如果没找到，则加载 index.vue impo

1. Vue 无法检测实例被创建时不存在于 data 中的 property 原因：由于 Vue 会在初始化实例时对 property 执行 getter/setter 转化，所以 property 必须在 data 对象上存在才能让 Vue 将它转换为响应式的。 场景： 123456var vm = new Vue({ data:{}, // 页面不会变化

1. 简介组件中包含视图(模板template)、双向绑定的数据(data)、以及一些方法(methods)，这3个都写在同一个组件(component)里面, 一般视图(View)触发方法动作(Actions)，动作影响数据状态(State), 数据状态的改变又反应到视图(View)上来，这样在一个组件内就形成了一个闭环。即当前组件的视图使用当前组件的数据，当前组件的动作(方法)只修改当前组件的

src : 放置组件和入口文件12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697

npm介绍npm 最初它只是被称为 Node Package Manager，用来作为Node.js的包管理器。但是随着其它构建工具(webpack、browserify)的发展，npm已经变成了 “the package manager for JavaScript”，它用来安装、管理和分享JavaScript包，同时会自动处理多个包之间的依赖。 常见的使用场景有以下几种： 允许用户从 NPM

package.jsonnpm 5 版本在延续 npm 3 扁平化依赖包安装方式的基础上，新增了一个package-lock.json文件。package-lock.json的主要作用就是锁定依赖项的安装目录和依赖包的版本信息。 当我们执行npm install的时候，node会从package.json文件读取模块名称，从package-lock.json文件中获取版本号。cnpm insta

npm scripts 使用指南 - 阮一峰的网络日志 一、什么是 npm 脚本？package.json文件有一个scripts字段，可以用于指定脚本命令，供npm直接调用。 12345678{ // ... "scripts": { "build": "node build.js" "lint": "jshint **.js", "test": "mo

安装包npm 的包安装分为本地安装（local）、全局安装（global）两种。 安装指定版本1npm install node-sass@4.12.0 本地安装(默认)123npm install <包> # 本地安装# 或者npm i <包> 将安装包放在 ./node_modules 下（运行 npm 命令时所在的目录），如果没有 node_modules

查看npm源1npm get registry 更换 npm 镜像站点在国内，在使用npm安装JS包之前建议先更改npm的镜像。推荐使用阿里的镜像源：https://registry.npmjs.org/。 备注：2021 年淘宝发文称 npm 淘宝镜像已经从 registry.npm.taobao.org 切换到了 registry.npmmirror.com。旧域名也将于 2022 年 5