Vue 3

Vu3

简述: 快速上手,开发即用,具体知识参考官方文档

具备知识

Vite

了解即可,使用时按需配置,更多参考官方文档( https://cn.vitejs.dev)

简述: 极速响应工具 (构建、启动、更新、插件使用等)

核心思想: 依赖 和 源码

工作原理:

引入rollup: 灵活,相比webpack速度快,适配 、esbulid(预构建依赖):打包速度快,兼容性差

HMR(动态模块热更新、热替换)

原生模块化提供源码,部分浏览器优化处理及按需加载

vite对于浏览器缓存处理: 源码(304协商缓存) ,依赖(强缓存)

TS

https://www.tslang.cn/index.html

通用写法

单文件组件(通过构建使用)

单组件
选项aip写法
组合api写法

可通过引入cdn

Composition API

ref

给源码传值,框架自动响应数据更新视图

支持参数: string、number、object、symbol、array

但若对数据不可修改,返回通过Object原型生成数据格式 RefImpl ,可通过value拿值

xxx.value

有一种情况可修改其数据

 setup() {let obj = { name: 'vue3' };let data = ref(obj);data.value.name = 'aaa'; // ref不可修改值,但传入的是对象,源码自动判断为reactive,因此可修改值,return {data}}
reactive

响应式数据更新视图

支持参数: object

可修改原数据值

setup () {let obj = {name:'vue3'};let data = reactive(obj);data.name = 'haha';  // 可对值修改return {data			}}
toRef
setup () {let obj = {name:'vue3'};let data = reactive(obj);data.name = 'haha';  // 可对值修改return {data			}}

// 待更新

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

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

相关文章

数据结构——堆的实现(详解)

呀哈喽&#xff0c;我是结衣。 堆的介绍 如果有一个关键码的集合K {k0,k1,k2,…,kn-1},把它的所有元素按照完全二叉树的顺序储存方式储存在一个一维数组中&#xff0c;并满足&#xff1a;Ki<K2i1且ki<K2i2(Ki>K2i1且Ki>-K2i2)i 1,2,3…,则称为小堆&#xff08;或…

Windows系统管理之备份与恢复

本章目录&#xff1a; 一. 本章须知&#xff1a; 前置条件 需要创建一个新的磁盘 前置条件2 给新添加的磁盘分盘 二. 了解开启并学会使用Windows sever backup 如何使用备份与恢复“备份计划”“一次性备份”“恢复” 最后是用命令行“一次性备份命令 ”完成一次备份 话不多说 …

React中如何解决点击<Tree>节点前面三角区域不触发onClick事件

React中如何解决点击节点前面三角区域不触发onClick事件&#xff0c;如何区别‘左边’和‘右边’区域点击逻辑呢&#xff1f;&#xff08;Tree引用开源组件TDesign&#xff09; 只需要在onClick里面加限制一下就行&#xff1a; <TreeexpandMutexactivabletransitiondata{t…

从0开始学习JavaScript--JavaScript函数返回值

在JavaScript中&#xff0c;函数是一种强大的工具&#xff0c;不仅能够执行一系列操作&#xff0c;还可以返回值。理解函数返回值的概念对于编写清晰、灵活的代码至关重要。本文将深入探讨JavaScript函数返回值的各种方面&#xff0c;包括基本返回值、多返回值、异步函数的返回…

STM32_8(DMA)

一、DMA DMA&#xff08;Direct Memory Access&#xff09;直接存储器存取DMA可以提供外设和存储器或者存储器和存储器之间的高速数据传输&#xff0c;无须CPU干预&#xff0c;节省了CPU的资源12个独立可配置的通道&#xff1a; DMA1&#xff08;7个通道&#xff09;&#xff…

吉他初学者学习网站搭建系列(3)——如何实现吉他在线调音

文章目录 背景知识teoriapitchytone效果 背景知识 学过初中物理就会知道&#xff0c;声音是由空气振动产生的。振动产生波&#xff0c;所以声音就是不同振幅和频率的波构成的。振幅决定了声音的响度&#xff0c;频率决定了声音的音高。想更进一步了解的可以访问这个网页wavefo…

万字解析设计模式之责任链模式、状态模式

目录 一、责任链模式 1.1概述 1.2结构 1.3实现 1.4 优缺点 1.5应用场景 1.6源码解析 二、状态模式 2.1概述 2.2结构 2.3实现 2.4优缺点 2.5应用场景 三、责任链模式实验 任务描述 实现方式 编程要求 测试说明 四、状态模式实验 任务描述 实现方式 编程要…

Leetcode—55.跳跃游戏【中等】

2023每日刷题&#xff08;四十&#xff09; Leetcode—55.跳跃游戏 贪心法实现代码 #define MAX(a, b) ((a > b)? (a): (b))bool canJump(int* nums, int numsSize) {int k 0;for(int i 0; i < numsSize; i) {if(i > k) {return false;}k MAX(k, i nums[i]);}r…

Linux(7):Vim 程序编辑器

vi 基本上 vi 共分为三种模式&#xff0c;分别是【一般指令模式】、【编辑模式】与【指令列命令模式】。 这三种模式的作用分别是&#xff1a; 一般指令模式(command mode) 以 vi 打开一个文件就直接进入一般指令模式了(这是默认的模式&#xff0c;也简称为一般模式)。在这个模…

微软 Edge 浏览器目前无法支持 avif 格式

avif 格式在微软 Edge 浏览器中还是没有办法支持。 如果你希望能够查看 avif 格式&#xff0c;那么只能通过浏览器打开&#xff0c;然后浏览器将会把这个文件格式下载到本地。 avif 格式已经在其他的浏览器上得到了广泛的支持&#xff0c;目前不支持的可能就只有 Edge 浏览器。…

管理后台系统,springboot+redis+nginx+html+bootstrap

一个简易版的管理后台系统&#xff0c;前后端分离&#xff0c;可适用于小团队开发&#xff0c;支持二次开发。 后端主要技术springboot&#xff0c;他可以帮我们快速的搭建项目&#xff0c;并快速实现开发。 redis做缓存&#xff0c;保存登录状态和一些高频率查询的基础数据。…

浅谈建筑节能监管平台在高校能源管理中的实践与应用

安科瑞 华楠 摘要&#xff1a;以节约型校园建设示范工程———宁夏大学节能监管平台项目建设为例&#xff0c;对系统的总体构架、关键技术、管理软件功能进行了详细的介绍。同时针对项目建设、运行和管理过程中出现的一些问题&#xff0c;提出有针对性的解决措施&#xff0c;为…

.NET6 开发一个检查某些状态持续多长时间的类

📢欢迎点赞 :👍 收藏 ⭐留言 📝 如有错误敬请指正,赐人玫瑰,手留余香!📢本文作者:由webmote 原创📢作者格言:新的征程,我们面对的不仅仅是技术还有人心,人心不可测,海水不可量,唯有技术,才是深沉黑夜中的一座闪烁的灯塔 !序言 在代码的世界里,时常碰撞…

从0到0.01入门 Webpack| 007.精选 Webpack面试题

&#x1f90d; 前端开发工程师&#xff08;主业&#xff09;、技术博主&#xff08;副业&#xff09;、已过CET6 &#x1f368; 阿珊和她的猫_CSDN个人主页 &#x1f560; 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 &#x1f35a; 蓝桥云课签约作者、已在蓝桥云…

SLAM ORB-SLAM2(9)闭环检测器

SLAM ORB-SLAM2(9)闭环检测器 1. LoopClosing2. 成员变量2.1. 系统成员变量2.2. 关键帧2.3. 共视关系2.4. 闭环检测2.5. 全局 BA(光束法平差)2.6. 其他操作3. 成员函数3.1. 构造函数3.2. 主要函数3.3. 更新操作3.4. 标识设置和查询接口1. LoopClosing 在《SLAM ORB-SLAM2(…

Spring Cloud 版本升级遇坑记:OpenFeignClient与Gateway的恩怨情仇

Spring Cloud 版本升级遇坑记&#xff1a;OpenFeignClient与Gateway的恩怨情仇 近日&#xff0c;在对项目中的 Spring Boot、Spring Cloud 以及 Spring Cloud Alibaba 进行版本升级时&#xff0c;遭遇了一个令人头疼的问题&#xff1a;Spring Cloud Gateway 在运行时一直卡住&a…

探索亚马逊云科技云存储服务的性能

文章作者&#xff1a;Libai 引言 随着企业越来越多地依赖云存储解决方案&#xff0c;确保存储性能的最佳状态变得至关重要。在本文中&#xff0c;我们将探讨在亚马逊云科技云存储服务上进行存储性能基准测试的重要性&#xff0c;以及如何帮助企业做出资源分配和优化的明智决策…

20231125硬盘电源线5线不能识别日立10T的硬盘的解决方法

20231125硬盘电源线5线不能识别日立10T的硬盘的解决方法 2023/11/25 23:00 缘起&#xff0c;在拼多多买了2片10TB的7200rpm的日立二手硬盘。 型号&#xff1a;日立 mar-2018 10T硬盘 接上电脑&#xff0c;硬盘感觉在转动了【正常上电了。】 但是X99主板&#xff0c;在WIN10下就…

BC76 [NOIP2008]ISBN号码

#include<stdio.h> int main() {char arr[13]; //存放13位的ISBNint i, j;scanf("%s",arr);int s 0;for(i0, j1; i<11; i){if(arr[i] ! -){s (arr[i]-0)*j; //将字符换成int累加&#xff1a;0162……29158j; //执行if的时候加&#xff0c;不执行不加…

Springmvc原理解析

1. DispatcherServlet springmvc的核心控制器&#xff0c;负责截获所有的请求&#xff0c;当截获请求后委托给HandlerMapping进行请求映射的解析工作&#xff0c;目的是找到哪一个Controller的方法可以处理该请求&#xff0c;找到后再交由给HandlerAdaptor去负责调用并返回Mod…