vue-learning:20 - js - 区别:filters / data / computed / watch / methods
区别:filters / data / computed / watch / methods
在配置对象options
中,filters
/data
/computed
/watch
/methods
的每一项都有适合的场景,并且通常在项目中都是混合使用。
data
对象适合纯粹的数据。如果想要某个数据在某个地方应用后需要视图改变的话,那就好放在data
对象中,如果需要响应逻辑运算后的结果那最好使用计算属性。如果需要外部参数参与逻辑运算的话那就使用方法。
filter
是纯函数,适合模板或v-bind
值的格式化,比计算属性高效,可以替代部分计算属性的功能。
watch
适合监听异步事件,执行异步回调。
选项 | 可读 | 可写 | 有默认参数 | 可以传入参数(非默认) | 进行逻辑运算 | 有缓存 |
---|---|---|---|---|---|---|
data | 是 | 是 | 无 | 否 | 可以接受简单表达式 | 无 |
computed | 是get | 是set | set(newVal) | 否 | 是 | 是 |
watch | 是 | 否 | (newVal, oldVal) | 否 | 是 | 无 |
methods | 是 | 否 | 事件处理对象event | 是 | 是 | 无 |
filtes | 是 | 否 | val | 是(作为第二个参数开始) | 是 | 无 |
vue-learning:20 - js - 区别:filters / data / computed / watch / methods的更多相关文章
- Vue.js中 computed 和 methods 的区别
官方文档中已经有对其的解释了,在这里把我的理解记录一下Vue中的methods.watch.computed computed 的使用场景 HTML模板中的复杂逻辑表达式,为了防止逻辑过重导致不易维护 ...
- Vue 中computed 与 methods 区别
1.示例 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF- ...
- vue计算属性computed和methods的区别
computed和methods的区别 在new Vue的配置参数中的computed和methods都可以处理大量的逻辑代码,但是什么时候用哪个属性,要好好区分一下才能做到正确的运用vue. com ...
- vue系列---理解Vue中的computed,watch,methods的区别及源码实现(六)
_ 阅读目录 一. 理解Vue中的computed用法 二:computed 和 methods的区别? 三:Vue中的watch的用法 四:computed的基本原理及源码实现 回到顶部 一. 理解 ...
- Vue 基础自查——watch、computed和methods的区别
1 前言 创建一个Vue实例时,可以传入一个选项对象 const vm = new Vue({ data: { msg: 'hello' }, computed: {}, methods: {}, w ...
- 怎样理解 Vue 中的计算属性 computed 和 methods ?
需求: 在 Vue 中, 我们可以像下面这样通过在 引号 或 双花括号 内写 js 表达式去做一些简单运算, 这是可以的, 不过这样写是不直观的, 而且在 html 中 夹杂 一些运算逻辑这种做法其实 ...
- 学习RaphaelJS矢量图形包--Learning Raphael JS Vector Graphics中文翻译(一)
(原文地址:http://www.cnblogs.com/idealer3d/p/LearningRaphaelJSVectorGraphics.html) 前面3篇博文里面,我们讲解了一本叫做< ...
- 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十五 ║Vue基础:JS面向对象&字面量& this字
缘起 书接上文<从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十四 ║ VUE 计划书 & 我的前后端开发简史>,昨天咱们说到了以我的经历说明的web开发经历的 ...
- 最新的vue没有dev-server.js文件,如何进行后台数据模拟?
https://blog.csdn.net/qq_34645412/article/details/78833860 https://blog.csdn.net/qq_34645412/article ...
随机推荐
- C++ 标准库 permutation
首先,permutation指的是对元素的重排,比方a , b , c 三个元素的全部的重排为 abc, acb, bac,bca,cab,cba 总共 3! = 6 中情况,可是怎样声称这六 ...
- python 不定长参数**kwargs
- Python中基于socketserver实现并发的socket
1.基于TCP协议: 服务端: import socketserver class MyHandler(socketserver.BaseRequestHandler): def handle(sel ...
- Javascript中的定时调用函数setInterval()和setTimeout()
首先介绍这两个函数 一.setInterval() 按照指定的周期来调用函数或表达式,执行多次.(时间单位:ms) timer = setInterval("content =documen ...
- Logtail提升采集性能
默认性能限制 为防止滥用消耗过多机器资源,我们对默认安装的Logtail进行了一系列的资源限制.默认安装的Logtail最多日志采集速度为20M/s,20个并发发送. 其他资源限制请参考:启动参数 h ...
- 宝塔linux
宝塔linux linux 定时任务管理
- python2和python3一些不同
文件写法: #python2fp=file(filepath,'wb')#python3# fp = open(filepath, 'wb') 关于乱码问题: #python2 #coding=utf ...
- oracle计算记录条数
和一般的观点相反, count(*) 比count(1)稍快 , 当然如果可以通过索引检索,对索引列的计数仍旧是最快的. 例如 COUNT(EMPNO)
- H3C 代理ARP
- GPU选型
1-基本概念 显存带宽 是指显示芯片与显存之间的数据传输速率,它以字节/秒为单位.显存带宽是决定显卡性能和速度最重要的因素之一. 2-常见GPU性能参数 GPU型号 单卡显存 cuda 计算能 ...