qq_15906903的博客

12.1 Vuex 概述官方文档：https://vuex.vuejs.org/zh/Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化Vuex简单理解：Vue 应用中的每个组件在 data() 中封装着自己数据属性，而这些 data 属性都是私有的，完全隔离的如果我们希望多个组件都能读取到同一状态数据属性，或者不同组件的行为需要更新同一状态数据属性，这就需要一个将共享的状态数据属性进行集中式

11.1 解决什么问题问题：前后端分离项目，前端和后端人员都是根据 API 文档进行开发项目的，不应该直接相互依赖， 前端人员不应该等待后端开发好接口后再进行测试，既然不依赖后端接口，那前端人员应该如何测试呢？解决：可以通过模拟数据生成器，通过一定规则 （API文档）生成模拟数据接口, 提供给前端人员进行测试。11.2 什么是 Mock.js官网：http://mockjs.com/文档：https://github.com/nuysoft/Mock/wikiMock.js 是用

10.1 什么是 Vue-CLIVue-CLI 是 Vue 官方提供的, 用来搭建项目脚手架的工具，它是 Vue.js 开发的标准工具，它已经集成了webpack , 内置好了很多常用配置, 使得我们在使用 Vue 开发项目时更加的标准化作用： 通过 Vue-CLI 下载模板项目官方文档：https://cli.vuejs.org/zhgithub站点：https://github.com/vuejs/vue-cli10.2 Vue CLI 安装全局安装 Vue-CLI安装成功后，在命

9.1 打包 Vue 基本配置基于 webpack-demo6安装 vue-loader 和 vue-template-compiler 依赖修改 webpack.config.js 配置在 src 目录下创建 App.vue在 main.js 中导入 App.vue导入之后，这个 App 组件就可以作为子组件进行使用了打包控制台不报错，说明配置正确打包成功9.2 webpack与 Vue 单文件组件案例创建 webpack-demo6安装 vue

1 Webpack 介绍1.1 Webpack 是什么Webpack 是一个前端的静态模块资源打包工具，能让浏览器也支持模块化。它将根据模块的依赖关系进行静态分析，然后将这些模块按照指定的规则生成对应的静态资源。1.2 Webpack 作用Webpack 核心主要进行 JavaScript 资源打包如下图，它可以结合其他插件工具，将多种静态资源css、png、sass 分类转换成一个个静态文件，这样可以减少页面的请求。可集成 babel 工具实现 EcmaScript 6 转 EcmaScr

7.1 什么是路由Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成，让构建单页面应用变得非常简单。通过根据不同的请求路径，切换显示不同组件进行渲染页面。7.2 基本路由使用7.2.1 安装路由7.2.2 引入 vue-router.js7.2.3 HTML 路由切换7.2.4 JS 配置路由7.3 缓存路由组件7.3.1 场景与作用默认情况下，当路由组件被切换后组件实例会销毁，当切换回来时实例会重新创建。如果可以缓存路由组件实例，切换后

6.1 Vue 实例生命周期6.1.1 生命周期钩子函数每个 Vue 实例在被创建时都要经过一系列的初始化过程生命周期分为三大阶段：初始化显示、更新显示、销毁Vue实例     初始化阶段的钩子函数：      beforeCreate() 实例创建前：数据和模板均未获取到      created() 实例创建后: 最早可访问到 data 数据

5.1 组件的概念组件（component） 是 Vue.js 最强大的功能之一。Vue 中的组件化开发就是把网页的重复代码抽取出来 ，封装成一个个可复用的视图组件，然后将这些视图组件拼接到一块就构成了一个完整的系统。这种方式非常灵活，可以极大的提高我们开发和维护的效率。通常一套系统会以一棵嵌套的组件树的形式来组织：例如：项目可能会有头部、底部、页侧边栏、内容区等组件，每个组件又包含了其它的像导航链接、博文之类的组件组件就是对局部视图的封装，每个组件包含了：HTML 结构CSS 样式J

4.1 过滤器4.1.1 什么是过滤器过滤器对将要显示的文本，先进行特定格式化处理，然后再进行显示注意：过滤器并没有改变原本的数据, 只是产生新的对应的数据4.1.2 使用方式定义过滤器全局过滤器局部过滤器：在Vue实例中使用 filter 选项 ， 当前实例范围内可用2. 过滤器可以用在两个地方：双花括号 {{}} 和 v-bind 表达式4.1.3 案例演示需求：实现过滤敏感字符，如当文本中有 tmd、sb 都将进行过滤掉过滤器传入多个参数 ，实

NPM 包管理工具1.1 什么是 NPM1.2 NPM 初始化项目1.3 安装模块1.3.1 安装方式1.3.2 本地安装1.3.3 全局安装1.1 什么是 NPMNPM 全称 Node Package Manager，它是 JavaScript 的包管理工具, 并且是 Node.js 平台的默认包管理工具。通过NPM 可以安装、共享、分发代码,管理项目依赖关系。可从NPM服务器下载别人编写的第三方包到本地使用。可从NPM服务器下载并安装别人编写的命令行程序到本地使用。可将自己编写的包或命令行程

3.1 Vue 内置指令总结参考：https://cn.vuejs.org/v2/api/#指令v-html 内容按普通 HTML 插入，可防止 XSS 攻击v-show 根据表达式的真假值，切换元素的 display CSS 属性来显示隐藏元素v-if 根据表达式的真假值，来渲染元素v-else 前面必须有 v-if 或 v-else-ifv-else-if 前面必须有 v-if 或 v-else-ifv-for 遍历的数组或对象v-on 绑定事件监听器v

2.1 Vue 入门开发2.1.1 创建工程在本地创建文件夹D:\Project\vue\WebStudy打开 VS Code ，点击 File > Open Folder ， 找到 D:\Project\vue\WebStudy 打开单击 WEBSTUDY 右侧的新建目录图标，创建目录： vue-01-core2.1.2 创建 HTML 和 安装 vue 模块在 vue-01-core 目录下新建一个页面 01-helloworld.html在 vue-01-core 目录下

1.1 Vue.js 介绍Vue 是什么主流的渐进式 JavaScript 框架什么是渐近式可以和传统的网站开发架构融合在一起，例如可以简单的把它当作一个类似 JQuery 库来使用。也可以使用Vue全家桶框架来开发大型的单页面应用程序 。使用它的原因vue.js 体积小，编码简洁优雅，运行效率高，用户体验好.无Dom操作，它能提高网站应用程序的开发效率什么场景下使用它一般是需要开发单页面应用程序 （Single Page Application, 简称:SPA） 的时候去用单页面应