Vue基础知识总结-Vuex
vuex1、什么是vuex？Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态， 并以相应的规则保证状态以一种可预测的方式发生改变简单来说，就是用来集中管理数据；
2、使用vuex的核心概念1）storevuex 中最关键的是store对象，这是vuex的核心。可以说，vuex这个插件其实就是一个store对象，每个vue应用仅且仅有一个store对象。
（1）创建store
1const store = new Vuex.Store({...});
可见，store是Vuex.Store这个构造函数new出来的实例。在构造函数中可以传一个对象参数。这个参数中可以包含5个对象：
state – 存放状态
getters – state的计算属性
mutations – 更改状态的逻辑，同步操作
actions – 提交mutation，异步操作
mudules – 将store模块化
关于store，需要先记住两点：
store 中存储的状态是响应式的，当组件从store中读取状态时，如果sto ...
Vue基础知识总结-VueRouter
vue-router1、vue-router如何响应 路由参数 的变化？提醒一下，当使用路由参数时，例如从 /user/foo 导航到 /user/bar，原来的组件实例会被复用。因为两个路由都渲染同个组件，比起销毁再创建，复用则显得更加高效。不过，这也意味着组件的生命周期钩子不会再被调用。
复用组件时，想对路由参数的变化作出响应的话，你可以简单地watch (监测变化) $route 对象：
12345678const User = { template: '...', watch: { '$route' (to, from) { // 对路由变化作出响应... } }}
或者使用 2.2 中引入的 beforeRouteUpdate 导航守卫：
12345678910const User = { template: '...', beforeRouteUpdate (to, from, next) { // react to rou ...
Vue基础知识总结-Vue-cli工程
vue-cli工程1、构建的 vue-cli 工程都到了哪些技术，它们的作用分别是什么？(1) vue.js：vue-cli工程的核心，主要特点是 双向数据绑定 和 组件系统。(2) vue-router：vue官方推荐使用的路由框架。(3) vuex：专为 Vue.js 应用项目开发的状态管理器，主要用于维护vue组件间共用的一些 变量 和 方法。(4) axios（ 或者 fetch 、ajax ）：用于发起 GET 、或 POST 等 http请求，基于 Promise 设计。(5) vux等：一个专为vue设计的移动端UI组件库。(6) 创建一个emit.js文件，用于vue事件机制的管理。(7) webpack：模块加载和vue-cli工程打包器。
2、vue-cli 工程常用的 npm 命令有哪些？下载 node_modules 资源包的命令：
1npm install
启动 vue-cli 开发环境的 npm命令：
1npm run dev
vue-cli 生成 生产环境部署资源 的 npm命令：
1npm run build
用于查看 vue-cli 生产环境部署 ...
Vue基础知识总结-核心知识点
1、对于Vue是一套渐进式框架的理解渐进式代表的含义是：没有多做职责之外的事，vue.js只提供了vue-cli生态中最核心的组件系统和双向数据绑定，就好像 vuex、vue-router都属于围绕vue.js开发的库。示例：
使用Angular，必须接受以下东西：1）必须使用它的模块机制。2）必须使用它的依赖注入。3）必须使用它的特殊形式定义组件（这一点每个视图框架都有，这是难以避免的）所以Angular是带有比较强的排它性的，如果你的应用不是从头开始，而是要不断考虑是否跟其他东西集成，这些主张会带来一些困扰。
使用React，你必须理解：1）函数式编程的理念。2）需要知道它的副作用。3）什么是纯函数。4）如何隔离、避免副作用。5）它的侵入性看似没有Angular那么强，主要因为它是属于软性侵入的。
Vue与React、Angular的不同是，但它是渐进的：1）可以在原有的大系统的上面，把一两个组件改用它实现，就是当成jQuery来使用。2）可以整个用它全家桶开发，当Angular来使用。3）可以用它的视图，搭配你自己设计的整个下层使用。4）可以在底层数据逻辑的地方用OO和设计模式的 ...
Vue自定义指令
知识点
全局api
Vue.directive指令
自定义指令的生命周期
全局api概述
全局api并不在构造器里面，而是先声明全局变量或者直接在vue中定义一些新功能，VUE内置了一些全局api,说简单点就是在构造器外面用vue提供给我们的api函数来定义新的功能.
Vue.directive 指令
学习了内部指令，但是我们想要定义一个v-hello的指令，其作用就是让文字变成绿色.
在开始之前先写一个小DEMO，页面上有一个数字是10，数字的下面有一个按钮，每次点击加1
代码如下：
1234567891011121314151617181920212223242526272829303132<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0"> <ti ...
Git常用上传文件方式
多种上传方式一、使用HTTPS方式上传本地的文件到Github：1234567891011121314151617# 初始化本地仓库git init# 创建文件/文档mkdir 文件名 / touch 文档名# 克隆远程仓库git clone https://github.com/user/仓库名.git# 添加文件到暂存区（.代表全部，或者all） git add . # 提交文件到工作区 -m 合并git commit –m '对文件/提交的说明 '# 把文件推送到远程仓库git push -u origin master# origin -> 远程仓库的名字，# origin/master -> 远程仓库的master分支。# git push origin master 就是将本地的master分支# ->push到远程仓库的与之有追踪关系的分支（通常名字相同）# -u 用户进程的最大数量
二、使用SSH方式上传本地的文件到Github：（1）查看/配置密钥
1234567891011121314# 查看是否已经存在本地公钥cat ...
把书念下去，然后走出去！
把书念下去，然后走出去！寥寥数字，却是半生总结。 “我走了很远的路，吃了很多的苦，才将这份博士学位论文送到你的面前。二十二载求学路，一路风雨泥泞，许多不容易。如梦一场，仿佛昨天一家人才团聚过。”
上述文字来自于一篇博士论文的《致谢》部分（如下图所示）。这篇情感真挚的《致谢》近日在豆瓣、知乎、微博等多个网络平台走红，作者在文中回顾自己如何一路走出小山坳、和命运抗争的故事打动了大批网友。
《致谢》结尾，他写道：“理想不伟大，只愿年过半百，归来仍是少年，希望还有机会重新认识这个世界，不辜负这一生吃过的苦。最后如果还能做出点让别人生活更美好的事，那这辈子就赚了。”
我看过也听过太多读书路上的故事，每次都能让自己在一个“状态”里警醒。
曾经面前堆砌着一摞摞的书本，老师在讲台上讲课，我手里拿着笔，眼睛里看着窗外，脑子里想着想不通的未来。``
现在觉得，那时看不清的前路才是最好的前进方向。
...
输入URL到页面加载过程
从输入 URL 到页面加载完成，发生了什么？这是一个简单的经典的过程：
1️⃣首先我们需要通过 DNS（域名解析系统）将 URL 解析为对应的 IP 地址，
2️⃣然后与这个 IP 地址确定的那台服务器建立起 TCP 网络连接，
3️⃣随后我们向服务端抛出我们的 HTTP 请求，服务端处理完我们的请求之后，
4️⃣把目标数据放在 HTTP 响应里返回给客户端，
5️⃣拿到响应数据的浏览器就可以开始走一个渲染的流程。渲染完毕，页面便呈现给了用户，并时刻等待响应用户的操作
（如下图所示）
我们将这个过程切分为如下的过程片段：一、基础版
浏览器根据请求的URL交给DNS域名解析，找到真实IP，向服务器发起请求；
服务器交给后台处理完成后返回数据，浏览器接收文件（HTML、JS、CSS、图象等）；
浏览器对加载到的资源（HTML、JS、CSS等）进行语法解析，建立相应的内部数据结构（如HTML的DOM）；
载入解析到的资源文件，渲染页面，完成。
二、详细版
在浏览器地址栏输入URL
浏览器查看缓存，如果请求资源在缓存中并且新鲜，跳转到转码步骤
如果资源未缓存，发起新请求
...
宏任务&微任务
什么是宏任务
我们可以将每次执行栈执行的代码当做是一个宏任务（包括每次从事件队列中获取一个事件回调并放到执行栈中执行）
每一个宏任务会从头到尾执行完毕，不会执行其他。
我们知道 JS引擎线程和 GUI渲染线程是互斥的关系，浏览器为了能够使 宏任务和 DOM任务有序的进行，会在一个 宏任务执行结果后，在下一个 宏任务执行前， GUI渲染线程开始工作，对页面进行渲染。
1// 宏任务-->渲染-->宏任务-->宏任务-->渲染．．
主代码块，setTimeout，setInterval等，都属于宏任务
第一个例子：
我们可以将这段代码放到浏览器的控制台执行以下，看一下效果：
1234document.body.style = 'background:black';document.body.style = 'background:red';document.body.style = 'background:blue';document.body.style = 'background: ...
Vue-MVVM浅析
vue 实现 todo-list
一、对 MVVM 的理解1.1 MVC
M - Model 数据
V - View 视图、界面
C - Controller 控制器、逻辑处理
1.2 MVVM
Model - 模型、数据
View - 视图、模板（视图和模型是分离的）
ViewModel - 连接 Model 和 View
1.3 关于 ViewModel
MVVM 不算是一种创新
但其中的 ViewModel 确实一种创新
真正结合前端场景应用的创建
1.4 MVVM 框架的三大要素
响应式：vue如何监听到 data 的每个属性变化？
模板引擎：vue 的模板如何被解析，指令如何处理？
渲染：vue 的模板如何被渲染成 html ？以及渲染过程
二、vue 中如何实现响应式2.1 什么是响应式
修改 data 属性之后，vue 立刻监听到
data 属性被代理到 vm 上
2.2 Object.defineProperty
2.3 模拟实现
三、vue 中如何解析模板3.1 模板是什么
本质：字符串
有逻辑，如 v-if v-for 等
与 html 格 ...
