Vue学习笔记(5. 计算属性,监视器(侦听器))

news2024/11/20 4:28:41

1. 计算属性(computed)

(1) get方式 

 初期显示

 改变值后(hello -> hello1)计算属性allStr跟随变更

 (2) get set方式

 页面初期显示

改变值(hello -> hello1)计算属性的get会监控到变更,使fullStr跟随变更

 

 改变计算属性(hello world -> hello world3)set 会监控到计算属性变更,做相应处理。

2. 监视器,侦听器 (watch)

(1). 监听值

组件初期化,不触发监听器

监听的值发生变化,会处罚监听器

 (2) 监听对象属性

用上记监听值的写法,监听对象,对象属性变化,不触发监听器

监听对象属性写法如下

(3) 深度监听

监听对象,对象属性变化,可以触发监听器

但是监听对象的newVal和oldVal都是变化后的值

(4) 立即监听

(5) 多属性监听

监听非响应式数据,需要数据前加 ()=>

3. 计算属性,监听器与函数的区别

(1) 调用次数

计算属性(computed),有缓存,值不变,多次调用属性只走一次

函数(methods),页面每次调用都走,

监听器(watch),监听的值变化都走,

(2) 作用

计算属性(computed),多用于监听多个属性的变化,对单个属性的影响,

监听器(watch),多用于监听单个属性,根据属性变化,做一系列处理

函数(methods),控制页面触发事件

注释:函数(methods)读取data数据需要用this关键字,事件中参数event是dom可操作dom对象

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/418798.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

国产SSD、内存卷哭国外大厂,三星宣布减产涨价在路上了

PC 圈有一句话是这么说的:论价格屠夫还得看国产品牌! 可不是嘛,国产长鑫、长江算是彻底将全球存储芯片市场搅局者这一「骂名」坐实了! 不说特别早期,前几年吧,普通单条 8G DDR4 内存都能卖到六七百元&…

C++ 红黑树

1.红黑树的概念 红黑树,是一种二叉搜索树,但在每个结点上增加一个存储位表示结点的颜色,可以是Red或Black。 通过对任何一条从根到叶子的路径上各个结点着色方式的限制,红黑树确保没有一条路 径会比其他路径长出俩倍,因…

D. Many Perfect Squares

题目链接:Problem - D - Codeforces 题意:给你一个数组,大小不超过50个。 问你让他们全部加上一个x,构造出来最多能够有多少个完全平方数。 思路: 先对数组排个序,首先它最少一定是有一个的&#xff0c…

Git配置SSH步骤

一、git 配置 (1)打开 git 命令窗口 (2)配置用户名(填自己的姓名) git config --global user.name “linjiaxiaozhu” (3)配置用户邮箱(填自己的邮箱) git…

电脑录屏的视频保存在哪里?您可以这样查看

案例:电脑录屏之后保存到哪里去了? “前几天,根据网络上的录屏教程试着录制了一下我的电脑屏幕,录制完成之后却找不到录制的视频。有没有小伙伴知道电脑录屏的视频保存在哪里?怎样才能快速找到?” 在现代…

pandas数据聚合和重组

介绍pandas数据聚合和重组的相关知识,仅供参考。 目录 1GroupBy技术 1.1简介 1.2对分组进行迭代 1.3选取一个或一组列 1.4通过字典或Series进行分组 1.5利用函数进行分组 2数据聚合 2.1简介 2.1面向列的多函数应用 2.2以‘无索引’的方式返回聚合数据 1G…

Faster R-CNN

目录 1. Fast R-CNN的不足 2. Faster R-CNN 3. RPN(Region Proposal Network) 3.1 anchor 3.2 RPN 网络 3.3 RPN 网络的损失 4. Faster R-CNN 损失 5. Faster R-CNN 训练 6. 对比 1. Fast R-CNN的不足 Fast R-CNN 的算法流程 Fast R-CNN网络运行速度慢的最主要原因&a…

浅谈根号分治与分块

文章目录1. 根号分治哈希冲突2. 线性分块引入教主的魔法[CQOI2011] 动态逆序对[国家集训队] 排队[HNOI2010] 弹飞绵羊蒲公英1. 根号分治 哈希冲突 题目1 nnn 个数,mmm 次操作。操作 1 为修改某一个数的值,操作 2 为查询所有满足下标模 xxx 等于 yyy 的…

一、基础算法6:双指针算法 模板题+算法模板(最长连续不重复子序列,数组元素的目标和,判断子序列)

文章目录算法模板双指针算法模板最长连续不重复子序列模板暴力法双指针算法数组元素的目标和模板判断子序列模板模板题最长连续不重复子序列原题链接题目题解数组元素的目标和原题链接题目题解判断子序列原题链接题目题解算法模板 双指针算法模板 for (int i 0, j 0; i <…

ForkJoinPool + RecursiveTask 来计算数组元素和

ForkJoinPool 是什么&#xff1f; ForkJoinPool 是一个 Java 并发编程框架&#xff0c;用于解决分治算法中的任务拆分、执行、合并等问题&#xff0c;是 Java 7 引入的一个新的工具类。 ForkJoinPool 的基本思想是将一个大任务划分成若干个小任务&#xff0c;然后并行执行这些…

SQL AVG函数

SQL AVG函数 SQL AVG函数简介 SQL AVG函数是一个聚合函数&#xff0c;用于计算集合的平均值。 以下说明了SQL AVG函数的语法&#xff1a; AVG([ALL|DISTINCT] expression)如果使用ALL关键字&#xff0c;AVG函数将获取计算中的所有值。 默认情况下&#xff0c;无论是否指定&a…

python+vue 图书馆读者行为分析系统-书友会

本系统主要包括以下功能模块&#xff1a;个人中心、用户管理、图书信息管理、图书分类管理、热门图书管理、书友会管理、报名信息管理、行为分析管理、在线论坛、系统管理等模块&#xff0c;通过这些模块的实现能够基本满足日常图书馆读者行为分析系统的操作。结合相关设计模式…

生成式 AI 与强人工智能:探索 AI 技术的未来

AIGC&#x1f388; AIGC&#xff08;AI Generated Content&#xff09; 即人工智能生成内容&#xff0c;又称“生成式 AI”&#xff08;Generative AI&#xff09;&#xff0c;被认为是继专业生产内容&#xff08;PGC&#xff09;、用户生产内容&#xff08;UGC&#xff09;之…

rust中的集合容器(切片和哈希)与错误处理

String、数组[T:n]、列表Vec\哈希表HashMap<K,V>等。 切片slice&#xff1b; 循环缓冲区 VecDeque、双向列表 LinkedList等。(这是指双向链表吗&#xff1f;) 这些集合容器的共性&#xff1a; 可以遍历 可以进行 map-reduce操作。 可以从一种类型转换成另一种类型。 主要…

VUE使用el-ui的form表单输入框批量搜索<VUE专栏三>

针对form表单的输入框单号批量查询&#xff0c;这里用换行符进行分割&#xff0c;注意v-model不要使用.trim 前端代码&#xff1a; <el-form-item label"SKU编码:" prop"prodNumbers"><el-input type"textarea" :rows"4" pla…

阿里数学竞赛决赛名单公布:北大人数是清华4倍 | 最小仅14岁

4月10日消息&#xff0c;第二届阿里巴巴全球数学竞赛决赛入围名单公布&#xff0c;全球12个国家516位选手晋级&#xff0c;晋级率仅有1&#xff05;。 根据参赛者填报信息&#xff0c;晋级选手80&#xff05;以上是90后&#xff0c;年纪最小的只有14岁。 入围人数最高的前20所高…

【Linux】git命令(基础,新手)

文章目录1.查看当前git版本信息2.安装git3.将远端仓库克隆到本地4.三板斧第一招&#xff1a;git add5.三板斧第二招&#xff1a;git commit6.三板斧第三招&#xff1a;git push7.对仓库文件进行更改8.查看使用提交日志9.查看本地与远端的同步状态10.从远端仓库拉取最新版本文件…

ChatGPT Plus价格太贵,可以约上三五知己一起上车体验一下,这个项目就能帮到你

❝ 对于想体验ChatGPT PLus的小伙伴&#xff0c;可能觉得自己一个人一个月花费20美元&#xff0c;相对于人民币每月137多&#xff0c;确实是一个不少的开支&#xff0c;如果&#xff0c;几个人合作一个账号&#xff0c;这样负担就减少了。刚好&#xff0c;最近逛github发现刚好…

深度学习-第R2周——LSTM火灾温度预测

深度学习-第R2周——LSTM火灾温度预测深度学习-第R2周——LSTM火灾温度预测一、前言二、我的环境三、前期工作1、导入数据集2、数据可视化四、构建数据集1、设置x,y2、归一化3、划分数据集五、构建模型六、模型训练1、编译2、训练七、评估1、loss图2、预测深度学习-第R2周——L…

MySQL数据库实现主主同步

前言 MySQL主主同步实际上是在主从同步的基础上将从数据库也提升成主数据库&#xff0c;让它们可以互相读写数据库&#xff0c;从数据库变成主数据库&#xff1b;主从相互授权连接&#xff0c;读取对方binlog日志并更新到本地数据库的过程,只要对方数据改变&#xff0c;自己就…