vue2进阶知识点

79 阅读1分钟
1. 全局过滤器 全局自定义指令(函数式和对象式) 全局混入

744ff0dfb963bdcf3ba7e2979767654.png

2. 全局事件总线(不同层级组件间通信)

0b1d8d07959ad1a97c958cb22d188b4.png

3. 消息订阅发布(pubsub)

9cdbe6f0954a0eedc862ac5e84ecd93.png

4. mapState mapGetters mapActions mapMutations

7378e17b1fa0a8419dbac021c5e3cd7.png 6a8552ffe46c046fcd6c6b4071184e5.png

5. vuex中action异步请求

7d837a610b92b2da7fc1cec4d8efa5b.png

6. vuex模块化以及命名空间的使用

420e4a00e7992c788db963981705e78.png 47c352039cfd1f20679a6fd74f08639.png

7. 路由跳转name来简化跳转

e445d84bf24a9683476c73595644579.png

8. 某个页面独享路由守卫

image.png

9. Vue.set和this.$set()

image.png

10. key的作用

image.png

11. vue数据代理

image.png

12. 数据劫持

也是利用Object.defineProperty(),如果有人修改student就会触发get和set方法 image.png

13. VueComponent

image.png image.png image.png image.png

14. render

image.png

15. history模式和hash模式

image.png image.png

16. node服务

解决history模式下404的问题, 利用中间件, Java中也有, 项目上可能用nginx来判断是前端路由还是后端路由 image.png image.png node模拟后端准备工作:

  1. 新建文件夹demo
  2. 在demo下npm init 变成合法包
  3. 之后一路回车
  4. npm i express安装
  5. 新建一个server.js主文件,写入上面第二张图的代码
  6. 新建一个static文件夹, 将打包后的dist文件夹下的所有文件拷贝到static文件夹下
  7. 以上已经完成
  8. 拓展: 在public内的静态资源, 在当前端口下也可以访问