fetch
-
原生js提供了两种数据请求方式
- ajax
- fetch
-
ajax vs fetch
- ajax需要封装的, fetch不需要
- ajax不太符合MV* 开发方式,fetch可以认为是js为了MV*方式做的量身打造
- fetch也是Promise
-
封装axios / fetch
- ajax
- xhr
- request
- http
computed 计算属性
作用:可以将本应该在v中处理的逻辑迁移到vm中,让其更符合MVVM思想
注意: 计算属性就相当于计算出来的结果,我们最好不去更改它
计算属性将被混入到 Vue 实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例。
注意如果你为一个计算属性使用了箭头函数,则 this 不会指向这个组件的实例,不过你仍然可以将其实例作为函数的第一个参数来访问。
示例:
watch 侦听属性
- 作用: 监听的,添加一些副作用【 由某一个数据改变而引起的其他变化 】
- 深入监听 vs 浅监听【 方法 】
- 深入监听可以监听多层,而方法只能监听一层
一个对象,键是需要观察的表达式,值是对应回调函数。值也可以是方法名,或者包含选项的对象。Vue 实例将会在实例化时调用 $watch(),遍历 watch 对象的每一个属性。
示例:
axios封装
(这是一个函数,需要携带参数)
示例:
总结:methods vs computed vs watch
-
项目中如何使用
-
事件处理程序: methods
-
watch 有大量数据交互和异步处理时进行
-
computed
-
有逻辑处理
-
V中像全局变量一样使用
-
-
混入
- 混入的形式
- 全局混入 【 不推荐 】
- 局部混入
- 混入的作用:
- 将选项中某一个或是多个单独分离出去管理,让职能更加单一高效,符合模块化思想
- 局部混入的使用
选项 minxins
- 全局混入
Vue.mixin({})
组件
- 了解前端组件化发展历史
- 前后端耦合
- 前后端不分离项目
- 找后台搭建项目开发环境
- 寻找项目目录中的静态资源目录
- js
- img
- css
- 同步修改css
- 前后端不分离项目
- 前后端分离
- 前端团队合作项目的出现
- 组件化为了解决多人协作冲突问题
- 复用
- 前后端耦合
2.组件的概念
- 组件是一个html 、 css 、js 、img 等的一个聚合体