摘要：
概述 UI 组件库：提供了一些如输入框、布局、按钮等在网页UI布局中常用的元素，并将这些元素以组件的形式提供给我们。 一般会说UI组件库是基于哪个框架【Vue/React/...】的、PC端/移动端 什么项目适合用UI组件库，什么项目不适合？【UI组件库的应用场景】 不适合【页面中包含很多定制化、个 阅读全文
摘要：
Element UI 完整引入 import ElementUI from 'element-ui'; //引入所有组件的样式 import 'element-ui/lib/theme-chalk/index.css'; 引入所有的组件 Vue.use(ElementUI); 注：仅用了几个组件，就 阅读全文
摘要：
VuePress 一、部署 创建项目文件夹 在任意目录下创建文件夹mydocs 注：路径中不要包含中文 安装VuePress npm install vuepress 注：如需全局安装，请执行npm install -g vuepress 初始化项目 在项目文件夹下打开命令行，执行 npm init 阅读全文
摘要：
模块化+命名空间 Vuex中的高级写法：Vuex的模块化编码 把不同分类【业务分类不同，比如订单管理类的和商品管理类的】的mutation放在不同位置 模块化编码的最终目标：对actions、mutations、state、getters中的内容进行分类整理 1. Vuex模块化编码的步骤 根据业务 阅读全文
摘要：
四个map方法的使用 这四个map方法的作用是帮我们生成代码。 计算属性优化了模板中的语法，使得插值语法变得简洁，但仍然没有解决代码冗余的问题，只是将插值语法中的冗余转移到了计算属性中 为什么我们需要生成代码？ 模板中获取state中的数据时，代码冗余很高，存在代码优化的可能。 可以通过计算属性简化 阅读全文
摘要：
getters配置项 概念：getters配置项并不是必须要使用的，当state中的数据需要经过加工后再使用时，可以使用getters加工。 应用场景：运算逻辑复杂而且需要复用，用于抽取基于state中数据的公共运算 在store.js中追加getters配置 ...... // 准备getters 阅读全文
摘要：
Vuex Devtools 由于Vue和Vuex都是由官方团队开发的，Vue的Devtools和Vuex的Devtools是合二为一的 组件页签、Vuex页签、事件页签 事件页签：观察自定义事件和全局事件总线中的事件 Vuex Devtools仅仅捕获mutations中的动作，actions中的动 阅读全文
摘要：
求和案例 // index.js import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const actions = { // 对于不包含业务逻辑也不进行Ajax请求转发的操作可以不经过actions，直接调用mutations中的 阅读全文
摘要：
搭建Vuex环境 安装Vuex npm i vuex@3 注：目前使用的是vue 2，所以要安装vuex 3 创建src/vuex/store.js或src/store/index.js，二选一，js文件的内容都是一样的，该文件用于创建Vuex中最为核心的store //引入Vue核心库 impor 阅读全文
摘要：
关于Vue和Vuex的版本对应关系 Vue 2 对应 Vuex 3 Vue 3 对应 Vuex 4 注：如果版本不对应，就会报错 阅读全文
摘要：
工作原理 vuex原理图 Devtools：vuex官方提供的开发者调试工具 Backend API：后端接口`` vuex原理图-理解 mutations相当于后端里的dao层，直接操作数据【数据库】 actions相当于后端里的Service层，封装业务逻辑，发送接口 如果一个操作没有业务逻辑或 阅读全文
摘要：
概述 一、是什么 在Vue中实现集中式状态（数据）管理的一个Vue插件，对vue应用中多个组件的共享状态进行集中式的管理（读/写），也是一种组件间通信的方式，且适用于任意组件间通信。 注：Vue和Vuex的关系与React和Redux是一样的 解析 集中式与分布式 状态 <=> 数据 <=> 状 阅读全文
摘要：
路由器的两种工作模式 对于一个url来说，什么是hash值？—— #及其后面的内容就是hash值。 hash值不会包含在 HTTP 请求中，即：hash值不会作为路径的一部分随着http请求带给服务器。【#/。。。】 hash模式：默认的工作模式 地址中永远带着#号，路由的名是以hash值的形式呈现 阅读全文
摘要：
路由守卫 作用：对路由进行权限控制，满足一定条件才能看到跳转到的路由组件 分类：全局守卫、独享守卫、组件内守卫 全局守卫: // src/router/index.js // router：我们创建的路由器实例 // router.beforeEach(function)：每一次进行路由跳转之前都会 阅读全文
摘要：
两个新的生命周期钩子 缓存路由组件和定时器一起使用时，如果进行了路由跳转，本应触发在beforeDestroy钩子中清除定时器方法，但因为缓存了路由组件，就导致原来的路由组件的beforeDestroy钩子不会被触发，定时器也就不会清除 作用：路由组件所独有的两个钩子，用于捕获路由组件的激活状态 阅读全文
摘要：
缓存路由组件 完善路由的技巧 作用：让不展示的路由组件保持挂载，不被销毁。 正常情况下，进行了路由跳转后，之前的组件会被销毁，如果之前的组件中存在input框之类的表单类组件，输入的内容也就消失了，也就是说，要保证路由跳转后不销毁之前的组件 具体编码： // 缓存的对象：并不是所有路由组件都需要 阅读全文
摘要：
编程式路由导航 作用：不借助<router-link> 实现路由跳转，让路由跳转更加灵活。 为什么需要除了<router-link>标签之外实现路由跳转的方式？ <router-link>标签最后变为<a>标签，无法实现button按钮的跳转 触发路由跳转可能需要异步触发，<router-link> 阅读全文
摘要：
<router-link>的replace属性 作用：控制路由跳转时操作浏览器历史记录的模式 浏览器的历史记录有两种写入方式：分别为push和replace，push是追加历史记录，不破坏栈中的任何一条数据，不断的压入数据，replace是替换掉当前栈顶的那一条记录。路由跳转时候默认为push 注： 阅读全文
摘要：
路由的props配置项 路由组件读取其他组件传递的参数时，是通过$route.params.id这种方式读取的，$route.params 部分代码冗余度高，如何能够降低这种冗余？props配置项可以做到 作用：让路由组件更方便的收到参数 { name:'xiangqing', path:' 阅读全文
摘要：
命名路由 命名路由：给你的路由规则起个名字 作用：可以简化路由的跳转【路由层级比较多时】。 如何使用 给路由规则命名： { path:'/demo', component:Demo, children:[ { path:'test', component:Test, children:[ { nam 阅读全文
