Vue3学习第二天记录

news2024/12/28 5:54:43

Vue3学习第二天记录

  • 背景
  • 说明
  • 截图记录
    • 一个简单的JS文件
    • Vue3的watch()函数
    • Vue3的toRef()/toRefs()函数
    • 前端数据类型的分类
    • 前端写一个对外暴露的函数
    • 前端的...语法
    • Vue3中watch()函数的总结
    • Vue3中watchEffect()函数
    • Vue3中watch()函数的坑
    • Vue3中computed()函数

背景

最近在学习尚硅谷的Vue2的入门课程, 后面也在Vue2的基础上介绍了一下Vue3, 这里简单做一个记录.

说明

个人学习笔记, 算是自己的一个简单的交付件, 可能对别人用处不大.

截图记录

一下是学习记录中的一些截图记录. 可能是当时有有点灵感. 后续也需要多多复习一下.

一个简单的JS文件

感觉就像一个非常简单的方法, 调用方只需要 userPoint() 就可以了, 非常简单. 但是实际项目中应该不会这样吧!
在这里插入图片描述

Vue3的watch()函数

有很多种场景, 具体用到的时候不妨再去查阅资料, 问问GPT
在这里插入图片描述

Vue3的toRef()/toRefs()函数

这里不能直接用ref(), 使用ref()其实是直接返回一个 RefImpl 的对象, 与上面的数据就是隔离开来的了.
在这里插入图片描述

前端数据类型的分类

总感觉前端的分类是: 基本数据类型, 普通对象, 数组.
但是在Java中就只有两类: 8大基本数据类型和引用数据类型
在这里插入图片描述

前端写一个对外暴露的函数

这个可以简写, 直接 export default function() {…}
使用默认暴露, 像是一个匿名函数.
在这里插入图片描述

前端的…语法

也是前端的基本功, 感觉是在解构一个对象. 把对象里面的属性都解构出来.
在这里插入图片描述

Vue3中watch()函数的总结

主要就监控属性, 笔记中老师列举了尽量多的场景, 这里留一个印象, 需要使用的时候再去深究.
在这里插入图片描述

Vue3中watchEffect()函数

这个函数就是, 你用到哪个属性我就去监视哪个属性.
直译过来感觉是: 起作用/生效的时候去监视.
在这里插入图片描述

Vue3中watch()函数的坑

老师讲解的版本中, watch()函数这个场景下不能正确获取oldValue
在这里插入图片描述

Vue3中computed()函数

和Vue2中computed配置功能是一样的.
在这里插入图片描述

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

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

相关文章

Flutter vscode环境如何进行真机测试

目录 1. 准备工作 1.1 安装Flutter和VS Code 1.2 安装必要的VS Code扩展 1.3 手机设置 2. 配置VS Code调试环境 3. 手机如何退出开发者模式 1. 准备工作 1.1 安装Flutter和VS Code 确保你已经在电脑上安装了Flutter SDK和VS Code。如果还没有,可以参考以下指…

彩虹外链网盘图床文件外链系统源码v5.5

彩虹外链网盘,是一款PHP网盘与外链分享程序,支持所有格式文件的上传,可以生成文件外链、图片外链、音乐视频外链,生成外链同时自动生成相应的UBB代码和HTML代码,还可支持文本、图片、音乐、视频在线预览,这…

校验参数个数工具类

项目中有个需求:前后端参数一致性校验,在某业务场景下后端代码需要校验参数个数,因此设计了1个工具类方便大伙使用,特此简单记录下。 校验参数个数工具类 一、校验工具类CheckNumInsideParamters二、单元测试ParameterSizeTest三…

AI办公自动化:用kimi批量删除文件名末尾的空格

工作任务:文件名末尾有一个空格,要批量删除掉,然后重命名 在Kimi中输入提示词: 你是一个Python编程专家,要完成一个脚本编写的任务,具体步骤如下: 读取"F:\aivideo"文件夹里面的全…

计算机毕业设计hadoop+spark+hive知识图谱股票推荐系统 股票数据分析可视化大屏 股票基金爬虫 股票基金大数据 机器学习 大数据毕业设计

哈 尔 滨 理 工 大 学 毕业设计中期检查报告 题 目:基于Spark的股票大数据分析及可视化系统 院 系: 计算机科学与技术学院 数据科学与大数据技术 姓 名: 鲍方博 指导教师&…

Locust:用Python编写可扩展的负载测试

Locust:简化性能测试,让负载模拟更直观- 精选真开源,释放新价值。 概览 Locust是一个开源的性能和负载测试工具,专门用于HTTP和其他协议的测试。它采用开发者友好的方法,允许用户使用普通的Python代码来定义测试场景。…

遍历目录

自学python如何成为大佬(目录):https://blog.csdn.net/weixin_67859959/article/details/139049996?spm1001.2014.3001.5501 遍历在汉语中的意思是全部走遍,到处周游。在Python中,遍历是将指定的目录下的全部目录(包括子目录)及…

go语言进阶 init() 函数

go 语言包 在一个项目中通常我们需要引入第三方包,我们来看下 当我们导入一个包的时候 发生了什么: 首先我们先详细介绍下两个函数: init(), main() 是 go 语言中的保留函数。我们可以在源码中 定义 init()函数, 此函数会在包导入…

CANopen for Python

系列文章目录 前言 该软件包支持与 CANopen 节点网络交互。 注意 这里的大部分文档都是从 CANopen 维基百科页面上直接盗用的。 本文档正在编写中。欢迎反馈和修改! CANopen 是用于自动化领域嵌入式系统的通信协议和设备配置文件规范。根据 OSI 模型&#x…

【背包-BM70 兑换零钱(一)】

题目 BM70 兑换零钱(一) 描述 给定数组arr,arr中所有的值都为正整数且不重复。每个值代表一种面值的货币,每种面值的货币可以使用任意张,再给定一个aim,代表要找的钱数,求组成aim的最少货币数。 如果无解,…

Promed Bioscience—高纯度胶原蛋白

Promed Bioscience——高纯度胶原蛋白供应商 专于研发,忠于质量,创新驱动 AXXORA 作为Enzo life sciences公司的子公司,是欧美最大的生命科学研究信息、服务、销售电子一站式服务平台之一,AXXORA精选欧洲四十多家优秀的生命科学研…

[Algorithm][动态规划][01背包问题][模板 背包][分割等和子集]详细讲解 +何为背包问题?

目录 0.何为背包问题?1.模板 背包1.题目链接2.算法原理详解3.代码实现 2.分割等和子集1.题目链接2.算法原理详解3.代码实现 0.何为背包问题? 背包问题:有限制条件下的"组合问题" 你有一个背包,地上有一堆物品&#xff…

基于zyyo主页与無名の主页合并二改,一款适合新手的个人主页

pengzi主页🙋 项目地址 简洁的布局:主页应该有清晰的布局,包括一个简洁的导航菜单和易于浏览的内容区域。避免使用过多的花哨效果,保持页面简洁明了。 个人资料介绍:在主页上展示一段简短的个人介绍,包括…

pikachu靶场(File Inclusion(文件包含)通关教程)

1.File Inclusion(local)本地文件包含 1.1打开网站,发现有个下拉框,随便选择一个,然后点击提交 1.2发现图中有个参数变了,其他的也会变,猜测这里可能有其他隐藏的文件 1.3直接进行抓包 ,右键发送到爆破模…

PXE、无人值守实验

PXE部署 [roottest2 ~]# systemctl stop firewalld [roottest2 ~]# setenforce 0一、部署tftp服务 [roottest2 ~]# yum -y install tftp-server.x86_64 xinetd.x86_64 [roottest2 ~]# systemctl start tftp [roottest2 ~]# systemctl enable tftp [roottest2 ~]# systemctl …

《深入浅出LLM 》(一):大模型概念综述

《深入浅出LLM 》(一):大模型概念综述 一、大模型概念 大规模语言模型(LargeLanguageModels,LLM),也称大规模语言模型或大型语言模型,是一种由包含数百亿以上参数的深度神经网络构建…

Python | Leetcode Python题解之第138题随机链表的复制

题目: 题解: class Solution:def copyRandomList(self, head: Optional[Node]) -> Optional[Node]:allNode[] # 用一个数组存储所有结点cur1headwhile cur1:allNode.append(cur1)cur1cur1.nextnlen(allNode)allRandom[-1]*n # 用一个数组存储所有节点…

Node.js后端构建指南:MongoDB与Express的集成

安装express 安装 Express 并将其保存到依赖列表中: $ cnpm install express --save 以上命令会将 Express 框架安装在当前目录的 node_modules 目录中, node_modules 目录下会自动创建 express 目录。以下几个重要的模块是需要与 express 框架一起安…

开源WebGIS全流程常用技术栈

1 数据生产 1.1 uDig uDig(http://udig.refractions.net/)是一个基于Java开源的桌面应用框架,它构建在Eclipse RCP和GeoTools(一个开源的Java GIS包)上。可以进行shp格式地图文件的编辑和查看;是一个开源空间数据查看…

前端最新面试题(基础模块HTML/CSS/JS篇)

目录 一、HTML、HTTP、WEB综合问题 1 前端需要注意哪些SEO 2 img的title和alt有什么区别 3 HTTP的几种请求方法用途 4 从浏览器地址栏输入url到显示页面的步骤 5 如何进行网站性能优化 6 HTTP状态码及其含义 7 语义化的理解 8 介绍一下你对浏览器内核的理解&#xff1…