Vue的方法和属性案例详解

发布时间:2022-04-16 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了Vue的方法和属性案例详解脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

vue的方法和属性

1.方法 methods

用法1

methods:{
方法名:function(){},
}

用法2

methods:{
方法名(){}
}

注意

{{}}调用要写()

示例

{{aa()}}

事件触发

@click=aa"可以有()也可以没有如果需要传参,加上()
把$event这个特殊参数传进去可以获取事件对象

2.计算属性

计算属性是什么

computed

计算属性的特点

  1. 计算属性有缓存
  2. 计算属性是基于他们的依赖进行缓存的
  3. 计算属性只有在他的相关依赖发生改变时才会重新求值当
  4. 计算属性所依赖的属性发生变化时他会重新计算一次

计算属性中的方法

set(da)
get()

示例

 	computed:{
                 //计算属性
                 //计算属性有缓存
                 //直接{{}}调用不用写()
                 //当计算属性所依赖的属性发生变化时他会重新计算一次

                 bb(){
                    return this.arr.filter(a=>a.indexOf(this.search) > -1)
                 },
                 cc:{
                     //调用计算属性时自动触发get方法,修改计算属性时自动触发set方法
                     set(a){
                        console.log('我是set'+"接收的内容"+a+"接收的内容")
                     },
                     get(){
                        console.log('我是get')
                        return this.arr.filter(a=>a.indexOf(this.search) > -1)

                     }
                 }
            },

到此这篇关于Vue的方法和属性案例详解的文章就介绍到这了,更多相关Vue的方法和属性内容请搜索脚本宝典以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本宝典!

脚本宝典总结

以上是脚本宝典为你收集整理的Vue的方法和属性案例详解全部内容,希望文章能够帮你解决Vue的方法和属性案例详解所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: