vue学习小总结

ES6箭头函数

1.一种定义函数的方式

const 函数名 = （参数列表）=> {}                 （如果只有一个参数，括号可以去掉）

2.函数代码块中只有一行代码

  // const mul = (num1, num2) => {
  //   return num1 + num2
  // }
  const mul = (num1, num2) => num1 * num2
  console.log(mul(20, 30));

3.箭头函数中的this向外层一层层查找

前端路由

npm安装：npm install vue-router --save

浏览器生成url，前端路由管理url与页面的映射

（1）vuerounter对象中，一个路径就是一个对像

（2）router-li 签相当于标签

（3）router-view标签来显示

路由默认路径

const routes = [
  {
    path: '',
    // redirect重定向
    redirect: '/home'
  },
....
....]

(p108开头5)

路由懒加载：将不同的路由对应的组件打包到不同的js文件里面

嵌套路由

 （未总结）

导航守卫

生命周期函数：

created（）{}       组件创建时回调的函数

mounted（）{}     组件挂载时回调的函数

updated（）{}       组件刷新时回调的函数

destroyed（）{}    组件销毁时回调的函数

---

activater（）{}      界面处于活跃状态时调用

deactivater（）{}      界面处于不活跃状态时调用

这两个函数只有keep-alive保留原来的状态不销毁时才有效

---

全局守卫

路由独享守卫

组件内守卫

（官网查询）

导航守卫 | Vue Router

文件别名

在webpack相应位置中修改

使用别名时需要在开头加上（~）

Promise

 

 例子：

满足状态时调用then（）函数

拒绝状态时调用catch（）函数

第二种写法

当需要两个或多个网络请求时才执行，可以用promise.all

 vuex

State保存状态

单一状态树管理所有状态

---

Getters

对state的数据处理后再获取，可以有三个属性（stater，getters，rootstate）

---

Mutation

state的更新

主要包括两部分：
        1.字符串的事件类型（type）

        2.一个回调函数，该函数的第一个参数就是state

如果传递的参数不是一个，通常用对象的形式传递。一般时“同步”操作

响应式规则：
只改变已经设置好的属性，新增加的属性不能相应

类型常量（疑惑）

---

Action（疑惑）

类似Mutation，进行异步操作

---

Module

里面可以放一个新的

---

对象的结构

网络模块化开发

 npm install anxios --save  依赖axios框架

 import axios from 'axios'（导入）

全局配置：

 axios实例（疑惑）

拦截器

发送请求时：

（1）config中的一些不良信息需要删除

（2）发送请求时界面要加载一个图标

（3）登录（或者其他请求）必须携带一些特殊信息

   ....

   ....

响应式拦截