qq_45994446的博客

如上图所示：切换组件News到Message时，News组件被销毁，组件内填的信息都会丢失；为了实现上图文字逐渐变浅的过程，以往是使用beforeDestory和mounted两个钩子的，但使用这两个钩子在页面跳转时也不能使定时器停下；通过路由规则,即只有点击进入，触发路由规则进入该组件，进入该组件时被调用；顾名思义单独写在某个组件里的路由守卫，其余的路由守卫都需要写在路由配置里。实现路由跳转，push是默认带缓存，replace是覆盖缓存。作用：路由组件所独有的两个钩子，用于捕获路由组件的激活状态。

key+value=路由，路由就是一组key与value的对应关系；一个路由器（router）管理多个路由；vue-router是vue一个插件库，专门用来实现SPA应用；

vuex在Vue中实现集中式状态（数据）管理的一个vue插件，集中式就像一个老师给一群学生上课，状态就是数据；vuex对vue应用中多个组件的共享数据进行集中式的管理（读、写），适用于任意组件间通信多个组件依赖于同一状态时；来自不同组件的行为需要变更同一状态（数据）

首先需要在脚手架上安装axios库然后引入axios后发送ajax请求；cmd通过运行服务器，然后通过axios会发现获取失败，跨域，违反了同源策略，即协议名，主机名，端口号有不同；解决跨域问题有以下方法：（1）：后端写服务器的人在服务器返回响应时添加响应头（2）：借助script标签的src属性引入外部资源不受限制，用的较少，需要后端人员配合，只能解决get请求问题；面试问的多；（3）如下图借助中间一个和请求端口号相同的代理服务器8080，类似房屋中介；

作用：实现任意组件间的通信即通过安装一个中间的通用全局事件总线x，且此x内包含$on,$emit,$off;且要满足所有组件可以访问到；所以这时可以在Vue的原型对象上添加x，设置值为vm或者vc。

button @click="unbind">解绑xiwang事件</button>通过$offunbind() {// 解绑一个自定义事件//解绑多个事件//解绑所有自定义事件},使用于父组件向子组件传递函数方法等，比如父组件APP向子组件Header传递函数子组件则不需要使用props接收，在methods中使用$emit触发自定义函数。

(1)拆分静态组件：组件要按照功能点拆分，命名不要与html元素冲突。(2)实现动态组件：考虑好数据的存放位置，数据是一个组件在用，还是一些组件在用：一个组件在用：放在组件自身即可。一些组件在用：放在他们共同的父组件上（状态提升），使用props其他组件都可以用。(3)实现交互：从绑定事件开始。

在另一个js中配置插件，然后通过import引入到main.js中// 全局过滤器})// 全局自定义指令 自动获取输入框焦点// 指令与元素成功绑定时调用},// 指令所在元素插入页面时// 设置焦点事件},// 指令所在模板重新解析时})// 定义混入data() {return {x: 100,y: 200},})// 给Vue原型上添加方法，vm和vc都能用alert('你好吗？')

放大10倍的n值为:点击n+1

原型可以解决构造函数浪费内存问题；每个构造函数都有prototype属性指向另一个对象，称为原型对象；作用：原型对象可以挂载函数，实例化不会多次创建原型上的函数，从而节约内存；可以将不变的方法写在prototype原型对象上，这样所有对象的实例就可以共享方法；构造函数和原型对象中的this都指向 实例化的对象总的来说就是公共属性写到构造函数里，公共方法写到原型里<script>// 构造函数// 公共方法写道到原型里console.log('唱歌');

data在收集data中的数据之前，先做了一个加工（这个加工也可以称之为数据劫持），那就是给每个数据匹配一个getter和setter，前面说了，Vue监视数据的原理，就是靠setter。（1）使用这些API:push()、pop()、shift()、unshift()、splice()、sort()、reverse()（2）Vue.set() 或 vm.$set()也可以实现响应式，第一个写改变的数组,第二个参数写索引，第三个写元素，可以改也可以加。2、并没有改变原本的数据, 是产生新的对应的数据。

写法:class=“xxx” xxx可以是字符串、对象、数组。字符串写法适用于：类名不确定，点击会变，要动态获取。数组写法适用于：要绑定多个样式，但是不确定绑定哪几个，就写成数组，省的一个一个绑定。对象写法适用于：要绑定多个样式，而且要动态决定用不用，这里面可以写一些判断的逻辑。

这里要和data和methods里的东西区分，data里的属性，methods里的函数，你写的都会原封不动放到vm里，但是computed里面的东西写的是对象，最后放到vm里的是这个对象的名，值是get里的返回值。2、所有不被Vue所管理的函数（定时器的回调函数、ajax的回调函数等、Promise的回调函数），最好写成箭头函数，这样this的指向才是vm 或 组件实例对象。利用watch属性handler方法监视函数，handler函数传两个参数，分别是：（修改之后的值，修改之前的值）

// 使通过obj2.x也能修改obj1的xget() {},})点击冒泡

中搜索axios复制script标签<script crossorigin="anonymous" src="https://cdn.bootcdn.net/ajax/libs/axios/0.19.2/axios.js"></script>;fetch它不像jquery和axios需要引入第三方库，它直接就能用，它就在window的内置对象中，直接就能用调用fetch函数。例1：使用script的src标签实现file协议到http协议的跨越,原理如此,不知道为啥运行不出来。通过script实现跨域。

AJAX全程为Asynchronous Javascript And XML,异步的js和XML通过AJAX 可以在浏览器中向服务器发送异步请求，最大的优势：无刷新获取数据。AJAX 不是新的编程语言，而是一种将现有的标准组合在一起使用的新方式。

迭代器是一个能快捷访问数据的接口，通过Symbol.iterator创建迭代器,然后由迭代器方法next方法获取迭代之后的结果.迭代器就是一个用于遍历数据结构的指针，一种新的遍历机制。

作为对象的属性和方法。

不懂可查询阮一峰文档或者MDN。

【代码】放大镜效果。