vue 计算属性(computed)

计算属性的简单用法

watch 的函数不需要被调用
computed的函数在调用的时候 不需要加 () 直接用 { {}}去渲染返回值
wacth 用来监控数据的变化
computed 用来计算大量的逻辑 你也可以把它当做属性去用 并不需要定义到 data 属性中 计算属性的结果会被缓存
除非相关依赖数据发生变化 否则值不会改变
应用：
computed 是一个属性被多个属性所影响的时候 典型的案例是购物车结算
watch 监听 多个数据受一条数据的影响 应用比如 百度搜索 联想列表的功能 智能客服

• 在模板中可以直接通过插值语法显示data数据 但是在哪某些情况下需要进行转换

	<div>{
    {
    fulling}}</div>data:{
    a: '早上'，b: '好'}computed:{
    fulling (){
    return this.a +this.b}}

计算属性的完整写法

• 一般是没有set 方法 没有set方法 是只读属性 不能改
• 不需要加小括号 计算属性 是计算后的结果 最终还是一个属性

	computed:{
    fulling (){
    set：function （setVal）{
    this.a = setVal.split().pop() // 修改 this.a 那么 data里面的数据就会修改 get方法读取的值 也是更改后的值},get :function (){
    return this.a +this.b}}}

计算属性和 methods 区别

• 计算属性有缓存 methods 没有
• 只要计算属性 依赖的 data里的数据没改变 就不会重新就算 会调用缓存