Vue中是计算属性  computed:{ }

                使用场景,如果有属性需要经过处理才输出时, 需要用到计算属性

computed:{

    计算方法:functiion(){

    }

}

Computed特点:

        1.computed默认只有getter方法

        2.计算属性最大的优点：产生缓存 如果数据没有发生变化 直接从缓存中取

        提升了代码运行效率

Seter方法设置:

        监听的属性由方法变为对象格式

                属性:{

                       set:function(newV){

                        设置值时触发

                },

               get:function(){

                          获取值时触发

                       }

                   }

Vue中的监听器 watch

        用于监听 vue中的属性改变

                正常监听:基本数据类型

                        属性:function(新值,老值){  }

                深度监听:复合数据类型

                        属性:{

                                deep: true  开启深度监听

                                handler:function(){   回调方法

                                        }

                                }

       监听器与计算属性的区别:

        1).计算属性的应用场景是计算的内容需要依赖多个属性的情况,侦听器的应用场景是计算的内容依赖一个属性的情况

        2).计算属性缓存结果时每次都会重新创建变量,而侦听器是直接计算，不会创建变量保存结果

计算属性有缓存, 监听没有缓存

        3).computed的结果是通过return返回的，而watch不需要return。

        4).watch中的参数可以得到侦听属性改变的最新结果，而computed函数没有这种参数。

Vue中的过滤器 filters

| 管道符

        属性部过滤器

在vue对象中加入

filters:{

        过滤器名 : function(a,b){ return 结果 }

 }

        全局过滤器

 Vue.filter(‘过滤器名’, (val) => { 

})

组件

        组件是可复用的 Vue 实例，且带有一个名字,具有一定功能

        组件分类

                以创建方式: 自定义组件  与  系统自带组件

        使用范围:  

                局部组件:  在vue对象中使用

                全局组件:  在任意组件中使用

        组件使用

                component    组件件

                template     模版        

        局部组件的使用方式:  创建--挂载--使用

        局部组件创建 :   局部组件就是一个对象 { }

        例:

                const mymodel = {

                        template:`

                                <h3>我是局部组件</h3>

                                `

                        }

        组件的挂载:  在Vue实例中的 components 中挂载

          例:

                components:{

                        mymodel    ====>  mymodel:mymodel

                }

            使用组件:   在HTML中, 以标签的形式加载  单双标签形势都可,推荐双标签

                <div id='app'>

                        <mymodel ></mymodel>

                </div>

注意:在组件中这个data必须是⼀个函数,返回⼀个对象

全局组件

        通过 Vue.component(组件名,{}) 创建全局组件,此时该全局组件可以在 任意模板(template)中使⽤

        Vue.component('Child',{

                template:`

                        <div>

                                <h3>我是⼀个⼦组件</h3>

                        </div>

                        `

                     })