脚本宝典收集整理的这篇文章主要介绍了

vue培训记录

脚本宝典小编觉得挺不错的,现在分享给大家,也给大家做个参考,希望能帮助你少写一行代码,多一份安全和惬意。

在公司做了一次vue相关的培训,自己整理了一些大纲。供大家参考学习!
当然 优先要先看官方文档

1. 项目构成及原理 Vue

  • 主流框架见解及差别

    • react ALL IN JS 灵活
    • angular 架构清晰 层级多 重
    • vue 类似react并吸收了angular的一些优点
  • Node运行在服务端的JS

    • 谷歌V8引擎 使JS语言能在服务器端运行
  • Webpack—一个前端的打包工具

    • 模块化拆分js
    • 使开发环境的代码能被浏览器编译
  • Vue单页spa框架

    • 实则是一个html
    • 没有刷新页面过渡可编译
  • Vue核心思想

    • 以数据驱动视图,尽量少用直接对DOM的操作
    • 一切都是模块组件
    • 单向数据流
  • Vue-cli脚手架工具 去年出的3.0

    • 以更好的项目架构去搭建vue项目
    • 打包创建一些需要的依赖
  • Vue项目创建
  • Vue的项目构成
  • Vue的一些常用es6 ECMAScript 6 入门

2. Vue路由 Vue Router

  • 路由的作用及工作原理

    • 以路径为键做模块加载
    • 路由的两种模式:hash history
  • 基础路由的配置
  • 路由全局守卫beforeEach、beforeResolve 、afterEach、beforeEnter
  • 组件内路由守卫beforeRouteEnter、beforeRouteUpdate 、beforeRouteLeave
  • 动态路由配置this.$router.addRoutes 只能添加顶级路由
  • keep-alive activated deactivated

3. 模板语法

  • v-if、v-for、v-show
  • dom指令 v-if v-for
  • 视图 v-show
  • 巧用三元运算
  • 方法绑定 '@'、'v-on'
  • 修饰符
  • 数据绑定 ':'、'v-bind'、'v-model'

4. Vue实例对象

  • 实例this
  • vue函数对象

    • this指向当前函数对象
  • 方法对象methods

    • 所有调用的方法集
  • 数据对象data

    • 数据驱动视图的核心
    • 只当create的时候赋值一次
  • 计算属性computed 性能优势

    • 利用缓存计算
    • 不能直接修改
  • 过滤器filter 注意this

    • 对字符串进行加工处理
    • 过滤器中取不到this
  • 数据监听watch 慎用深度监听

    • 对数据进行监听 做相应动作
    • 深度监听影响性能
  • 生命周期 beforecreated、created、beforeMount、mounted、beforeUpdate、updated、beforeDestory、destoryed

    • 常用created 获取数据,不触发updated,不造成页面2次渲染
    • 常用mounted 操作dom,触发update,造成页面2次渲染

5. 组件

  • 组件引用书写 'components'
  • 组件传参 props 传方法@
  • 修饰符sync语法糖
  • v-model语法糖
  • 父子组件交互 $emit $refs

    • 子组件通过$emit触发父组件传入的方法,并传入参数
    • 父组件通过在子组件添加ref,在方法中用$refs来拿子组件中的参数或调取子组件方法

6. 状态管理 VueX

  • VueX是什么,为什么要使用VueX
  • VueX的使用mutations、Action

7. Ajax请求

总结

以上是脚本宝典为你收集整理的

vue培训记录

全部内容,希望文章能够帮你解决

vue培训记录

所遇到的程序开发问题,欢迎加入QQ群277859234一起讨论学习。如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典网站推荐给程序员好友。 本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。

80%的人都看过