Vue的方法和属性案例详解
更新时间:2021年07月29日 10:07:50 作者:stay_少年与梦
这篇文章主要介绍了Vue的方法和属性案例详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下
vue的方法和属性
1.方法 methods
用法1
methods:{
方法名:function(){},
}
用法2
methods:{
方法名(){}
}
注意
{{}}调用要写()
示例
{{aa()}}
事件触发
@click=aa"可以有()也可以没有如果需要传参,加上()
把$event这个特殊参数传进去可以获取事件对象
2.计算属性
计算属性是什么
computed
计算属性的特点
- 计算属性有缓存
- 计算属性是基于他们的依赖进行缓存的
- 计算属性只有在他的相关依赖发生改变时才会重新求值当
- 计算属性所依赖的属性发生变化时他会重新计算一次
计算属性中的方法
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的方法和属性内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
Vue3中Element Plus Table(表格)点击获取对应id方式
这篇文章主要介绍了Vue3中Element Plus Table(表格)点击获取对应id方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-10-10
el-select自定义指令实现触底加载分页请求options数据(完整代码和接口可直接用)
某些情况下,下拉框需要做触底加载,发请求,获取option的数据,下面给大家分享el-select自定义指令实现触底加载分页请求options数据(附上完整代码和接口可直接用),感兴趣的朋友参考下吧2024-02-02


最新评论