一个项目学习Vue3---响应式基础
观察下面一段代码,学习响应式基础的全部内容
<template><div><div>将下面的msg属性放到上面来:{{ msg }}</div><button @click="count++">{{ count }}</button><button @click="object.count.value++">{{ object.count.value }}</button><button @click="open">点击变猪</button><button @click="addAge">长大一岁</button><a :href="hrefValue" id="herfValue">Dom更新的时间:{{ hrefValue }}</a><button @click="changeUrl">更改上面url</button><button @click="addAgeReactive">长大一岁{{ age.count }}</button></div>
</template><script lang="ts" setup>
import { nextTick } from 'vue'
import { ref } from 'vue'
import { reactive } from 'vue'
//绑定上方的学无止境
const msg = ref('学无止境')
//绑定上方的count
const count = ref(0)
//如果这么写count是不能被解包的
const object = { count: ref(1) }
//如果标签中存在object.count++则不会被解包
//必须使用object.count.value++才能//下面代买会输出学无止境
console.log(msg.value)
//绑定上方的变猪
function open() {msg.value = '猪'
}
//绑定一个对象
const user = ref({userName: '张三',age: 10
})
//增加一岁
function addAge() {user.value.age++
}
const hrefValue = ref('www.baidu.com')
async function changeUrl() {hrefValue.value = 'www.json.cn'let element = document.getElementById('herfValue')if (element) {console.log(element.getAttribute('href'))}await nextTick//他在执行了上面的nextTick方法之后才会改变值if (element) {console.log(element.getAttribute('href'))}
}
const age = reactive({ count: 0 })
//又增加一岁
function addAgeReactive() {//reactive创建的不需要写valueage.count++
}
let raw = {}
const proxy = reactive(raw)
//true
console.log(reactive(raw) === proxy)
//false
console.log(proxy === raw)
//即便返回
const proxy2 = reactive({})
proxy2.nested = raw
//返回false
console.log(proxy2.nested === raw)
proxy2.nested = proxy
//返回true
console.log(proxy2.nested === proxy)//reactive局限性
let state = reactive({ count: 0 })// 上面的 ({ count: 0 }) 引用将不再被追踪
// (响应性连接已丢失!) 重复赋值
state = reactive({ count2: 1 })
// 当解构时,count 已经与 state.count 断开连接
let { count2 } = state
// 不会影响原始的 state
count2++// 该函数接收到的是一个普通的数字
// 并且无法追踪 state.count 的变化
// 我们必须传入整个对象以保持响应性
//找不到count 这个属性,所以代理对象之间不能相互赋值
callSomeFunction(state.count2)function callSomeFunction(count) {//返回0console.log(count)
}//Ref自动解包
const name = ref('张三')
const bigName = reactive({ name })
//输出的实际是ref("张三")
console.log(bigName.name)
//ref("张三") = "李四"
bigName.name = '李四'
//返回李四
console.log(name.value)
//返回李四
console.log(bigName.name)//如果将一个新的 ref 赋值给一个关联了已有 ref 的属性,那么它会替换掉旧的 ref:
const otherName = ref("王五")
bigName.name = otherName
//返回王五
console.log(bigName.name)
//返回李四
console.log(name.value) //与 reactive 对象不同的是,当 ref 作为响应式数组或原生集合类型 (如 Map) 中的元素被访问时,它不会被解包:
const books = reactive([ref('Vue 3 Guide')])
// 这里需要 .value
console.log(books[0].value)const map = reactive(new Map([['count', ref(0)]]))
// 这里需要 .value
console.log(map.get('count').value)</script><style scoped>
</style>
他执行之后产生的页面是这样的
知识点1:ref()
当我们在script引入
<script lang="ts">import { ref } from 'vue'
</script>
我们就可以使用ref来代理一些变量,还记得我们在vue2中的写法吗?通过选项式API,我们在return中的变量都可以被vue双向绑定,而在vue3中我们可以使用更加便捷的方式来操作变量,
<script lang="ts">
import { ref } from 'vue'
setup(){const msg = ref('学无止境')return {msg}
}
</script>
在上面return中的内容就相当于vue2中任何return、methods等一切可以双向绑定的内容,是的,他也可以代理方法
<script lang="ts">
import { ref } from 'vue'
setup(){const msg = ref('学无止境')function open() {msg.value = '猪'}return {openmsg}
}
</script>
这样他就可以代理方法了,我们看到一个msg.value,什么意思呢?ref本质是一个对象,.value可以对对象进行解包,这样就可以获取msg的内容。当然如果你绑定到html代码里面,这个东西是会自动解包的
<div>将下面的msg属性放到上面来:{{ msg }}</div>
它也可以绑定对象等
<template><button @click="addAge">长大一岁</button>
</template>
<script lang="ts">
setup(){//绑定一个对象const user = ref({userName: '张三',age: 10})//增加一岁function addAge() {user.value.age++}return {user,addAge}
}
</script>
如果你想分别获取ref变化之前和之后的值,nextTick可以帮助到你
<template><a :href="hrefValue" id="herfValue">Dom更新的时间:{{ hrefValue }}</a><button @click="changeUrl">更改上面url</button>
</template>
<script lang="ts">
import { nextTick } from 'vue'
import { ref } from 'vue'
setup(){const hrefValue = ref('www.baidu.com')async function changeUrl() {hrefValue.value = 'www.json.cn'let element = document.getElementById('herfValue')if (element) {console.log(element.getAttribute('href'))}await nextTick//他在执行了上面的nextTick方法之后才会改变值if (element) {console.log(element.getAttribute('href'))}}return {changeUrl,hrefValue }
}
</script>
上面的代码在 await nextTick之前,他的值事还没有变化的,所以你hrefValue.value之后,是不能快速的获取到他的值的
写了这么多,我们发现每次都需要最后都要return,每次都需要写setup函数不方便,那么我们可以简化一些代码,例如上面那段代码,我们可以简化成
<template><a :href="hrefValue" id="herfValue">Dom更新的时间:{{ hrefValue }}</a><button @click="changeUrl">更改上面url</button>
</template>
<script lang="ts" setup>const hrefValue = ref('www.baidu.com')async function changeUrl() {hrefValue.value = 'www.json.cn'let element = document.getElementById('herfValue')if (element) {console.log(element.getAttribute('href'))}await nextTick//他在执行了上面的nextTick方法之后才会改变值if (element) {console.log(element.getAttribute('href'))}}}
</script>
这样就可以不写setup和return函数了,他会自己检测需要return的东西,函数或者变量都会被返回。
知识点2: reactive()
reactive的使用和ref基本类似
const age = reactive({ count: 0 })
//又增加一岁
function addAgeReactive() {//reactive创建的不需要写valueage.count++
}
如上面所示,他不需要进行写.value就可以对变量进行++操作
在比较相等性,也就是引用上,可能与我们想象的不同
let raw = {}
const proxy = reactive(raw)
//会引用同一个对象,返回true
console.log(reactive(raw) === proxy)
//封装的对象和原始对象不一样,返回false
console.log(proxy === raw)
const proxy2 = reactive({})
proxy2.nested = raw
//封装对象的属性被赋值普通对象,返回false
console.log(proxy2.nested === raw)
proxy2.nested = proxy
//封装对象的属性被赋值封装对象,返回true
console.log(proxy2.nested === proxy)
区别于vue2,return中的对象只会双向绑定,但是vue3中这么开放肯定会存在覆盖的现象
//reactive局限性
let state = reactive({ count: 0 })// 上面的 ({ count: 0 }) 引用将不再被追踪
// (响应性连接已丢失!) 重复赋值
state = reactive({ count2: 1 })
// 当解构时,count 已经与 state.count 断开连接
let { count2 } = state
// 不会影响原始的 state
count2++// 该函数接收到的是一个普通的数字
// 并且无法追踪 state.count 的变化
// 我们必须传入整个对象以保持响应性
//找不到count 这个属性,所以代理对象之间不能相互赋值
callSomeFunction(state.count2)function callSomeFunction(count) {//返回0console.log(count)
}
如上state又被重复赋值了,那么他最后指向的是后者 当解构时,count 已经与 state.count 断开连接,即便++,也只是普通变量的++,不能改变count2的值
知识点3:ref自动解包
//Ref自动解包
const name = ref('张三')
const bigName = reactive({ name })
//输出的实际是ref("张三")
console.log(bigName.name)
//ref("张三") = "李四"
bigName.name = '李四'
//返回李四
console.log(name.value)
//返回李四
console.log(bigName.name)//如果将一个新的 ref 赋值给一个关联了已有 ref 的属性,那么它会替换掉旧的 ref:
const otherName = ref("王五")
bigName.name = otherName
//返回王五
console.log(bigName.name)
//返回李四
console.log(name.value) //与 reactive 对象不同的是,当 ref 作为响应式数组或原生集合类型 (如 Map) 中的元素被访问时,它不会被解包:
const books = reactive([ref('Vue 3 Guide')])
// 这里需要 .value
console.log(books[0].value)const map = reactive(new Map([['count', ref(0)]]))
// 这里需要 .value
console.log(map.get('count').value)
就是有时候需要写.value,有时候不需要,在ref对象被当作一个对象传入时候是自动解包的,他在其他对象里面则无法自动解包
关注公众号:资小库,问题快速答疑解惑
相关文章:
一个项目学习Vue3---响应式基础
观察下面一段代码,学习响应式基础的全部内容 <template><div><div>将下面的msg属性放到上面来:{{ msg }}</div><button click"count">{{ count }}</button><button click"object.count.value">{{ o…...
白骑士的Python教学基础篇 1.5 数据结构
系列目录 上一篇:白骑士的Python教学基础篇 1.4 函数与模块 数据结构是编程语言中用于存储和组织数据的基本构件。在Python中,常见的数据结构包括列表(List)、元组(Tuple)、字典(…...
Go 常用文件操作
查找文件/目录 os.Stat(String)组合路径 dir, _ : homedir.Dir() filename : args[0] path : filepath.Join(dir, filename)homedir.Dir()为home根目录。 filepath.Join 会自动处理分隔符,将目录和文件名组合成文件路径。 检查是否含有后缀.json strings.HasSu…...
大数据、人工智能、云计算、物联网、区块链序言【大数据导论】
各位大佬好 ,这里是阿川的博客,祝您变得更强 个人主页:在线OJ的阿川 大佬的支持和鼓励,将是我成长路上最大的动力 阿川水平有限,如有错误,欢迎大佬指正 本篇序言前 必看 【大数据导论】—大数据序言 这是…...
ComfyUI流程图、文生图、图生图步骤教学!
前言 leetcode , 209. 长度最小的子数组 给定一个含有 n 个正整数的数组和一个正整数 target 。 找出该数组中满足其总和大于等于 target 的长度最小的子数组 [numsl, numsl1, …, numsr-1, numsr] ,并返回其长度。如果不存在符合条件的子数组,返回 0 …...
CSS基础知识学习指南
CSS基础知识学习指南 1. 介绍 CSS(层叠样式表)是用于描述HTML文档的呈现样式的语言。通过CSS,可以控制网页的布局、颜色、字体等各种样式,使得网页更加美观和用户友好。 2. CSS基础语法 CSS由选择器和声明块组成。选择器用于选…...
力扣hot100 -- 贪心算法
👂 ▶ 逍遥叹 - 胡歌&沈以城【Mashup】 (163.com) 👂 庐州月 - 许嵩 - 单曲 - 网易云音乐 2.7 小时,加上写博客,4 道题,😂 -- 希望二刷时,可以 3 小时,8 道题.... 目录 &…...
P2P文件传输协议介绍
P2P文件传输协议是一种基于对等网络(Peer-to-Peer,简称P2P)的文件共享和传输技术。以下是关于P2P文件传输协议的详细介绍: 一、定义与原理 P2P文件传输协议允许网络中的各个节点(即计算机或其他设备)之间…...
Spring Boot集成Spring Mobile快速入门Demo
1.什么是Spring Mobile? Spring Mobile是一个基于Spring Web MVC框架扩展的一个针对不同移动终端的应用开发框架。通过它我们在适配不同终端方面,就不用费劲心思了。 Spring Mobile的主要功能 自动设备检测: Spring Mobile在 server端内置了一个设备解…...
走进开源企业 | 湖南大学OpenHarmony技术实训活动在开鸿智谷顺利举办!
6月24日-6月26日,2024开放原子校源行之湖南大学信息科学与工程学院师生走进开源企业实训交流活动顺利落下帷幕。湖南大学信息科学与工程学院的师生代表团一行90人参与了湖南开鸿智谷数字产业有限公司(以下简称“开鸿智谷”)与母公司拓维信息系…...
TCP单进程循环服务器程序与单进程客户端程序
实验目的 理解并掌握以下内容: 网络进程标识(即套接字地址)在Linux中的数据结构与地址转换函数。网络字节序与主机字节序的定义、转换以及相关函数在网络编程中的应用。数据结构内存对齐的基本规则,以及基于数据结构构建PDU的基本方法。TCP单进程循环服务器与单进程客户端的…...
QT+winodow 代码适配调试总结(二)
已经好多年了, linux环境下不同版本的QT程序开发和部署,突然需要适配window环境程序调试,一堆大坑,还真是一个艰巨的任务,可是kpi下的任务计划,开始吧!! 1、首先我们自定义的动态库…...
百家讲坛 | 裴伟伟:企业中安全团队应当如何反馈漏洞
作者简介:裴伟伟,洞源实验室创始人,国家网安基地网络安全行业专家,网安加社区特聘专家,持有CISSP、PMP证书,曾在HITCON、可信云大会、开源产业大会等安全论坛发表演讲。曾任国内某安全实验室负责人、某互金…...
巧用Fiddler中的Comments提升接口测试效率
有没有同学在使用Fiddler时跟我遇到了同样的问题,就是想给某个抓包的请求进行注释!!!但是奇怪的是,根本没有Comments相关信息呀? 设置Comments 设置Comments非常容易,选中一个请求,…...
停车场车牌识别计费系统,用Python如何实现?
关注星标,每天学习Python新技能 前段时间练习过的一个小项目,今天再看看,记录一下~ 项目结构 说明: datefile文件夹:保存车辆信息表的xlsx文件 file文件夹:保存图片文件夹。ic_launcher.jpg是窗体的右上角…...
Linux内核——Linux内核体系模式(二)
1 Linux系统的中断机制 Linux内核将中断分为两类:硬件中断和软件中断(异常)。每个中断是由0-255之间的一个数字进行标识。 中断int0-int31(0x00-0x1f)作为异常int32-int255由用户自己设定 int32-int47对应与8259A中断…...
Spring MVC的高级功能——异常处理(一)简单异常处理器
一、HandlerExceptionResolver接口 如果希望对Spring MVC中所有异常进行统一处理,可以使用Spring MVC提供的异常处理器HandlerExceptionResolver接口。Spring MVC内部提供了HandlerExceptionResolver的实现类SimpleMappingExceptionResolver。它实现了简单的异常处理…...
【面试干货】Static关键字的用法详解
【面试干货】Static关键字的用法详解 1、Static修饰内部类2、Static修饰方法3、Static修饰变量4、Static修饰代码块5、总结 💖The Begin💖点点关注,收藏不迷路💖 在Java编程语言中,static是一个关键字,它可…...
软件工程实验
实验环境和需求 用户可以对相片进行按类别管理,用户可以设定不同的类别,然后上传照片到相应的类别中,并能进行照片的删除,注释 运行 运行并访问 localhost 8090,图片在数据库中的信息是D:/upgrade 后面的内容 se…...
对于复杂的网页布局,如多列布局和网格布局,CSS 有哪些最佳实践和技巧?
对于复杂的网页布局,如多列布局和网格布局,以下是一些CSS的最佳实践和技巧: 使用Flexbox或CSS Grid布局:Flexbox和CSS Grid是两个强大的CSS布局模型,可用于实现复杂的网页布局。Flexbox适用于单行或单列布局࿰…...
Spring Boot中集成Redis实现缓存功能
Spring Boot中集成Redis实现缓存功能 大家好,我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编,也是冬天不穿秋裤,天冷也要风度的程序猿!今天我们将深入探讨如何在Spring Boot应用程序中集成Redis,实现…...
arco disign vue 日期组件的样式穿透
问题描述: 对日期组件进行样式穿透. 原因分析: 如图,日期组件被展开时它默认将dom元素挂载到body下, 我们的页面在idroot的div 里层, 里层想要穿透外层是万万行不通的. 解决问题: 其实官网提供了参数,但是并没有提供例子, 只能自己摸索着过河. 对于日期组件穿透样式,我们能…...
【深度学习】pytorch训练中的一个大坑
使用的命令:iostat -x 5 可以看到 ssd的利用率已经满了。 之前在的数据集放在了 hdd上,训练结果特别慢。 所以我把它移动到了ssd上,然后训练参数用的 resume, 但是!!!!它把历史记住…...
python全局解释器锁(GIL)
文章目录 1.cpu工作方式2.python全局解释器锁与多线程3.其他语言的多线程4.如何解决假的多线程 1.cpu工作方式 先来先服务(First Come, First Served,FCFS): 最简单的调度算法,按照作业或进程到达的顺序依次执行。没有…...
无人机的起源
无人机起源于20世纪初的早期实验阶段,并随着技术进步逐步发展。无人机,作为现代科技领域中的一项重要创新,已经在全球范围内展现出其巨大的潜力和应用价值。 无人机的历史可以追溯到1917年,美国人艾德温.奥斯特林发明了“飞行训练…...
专题六:Spring源码之初始化容器BeanFactory
上一篇咱们通过一个例子介绍初始化容器上下文相关内容,并通过两个示例代码看到了Spring在设计阶段为我预留的扩展点,和我们应该如何利用这两个扩展点在Spring初始化容器上下文阶段为我们提供服务。这一篇咱们接着往下看。 老这样子下回到refresh方法上来…...
缓存双写一致性(笔记)
缓存更新方案 旁路缓存模式 这是比较多的 旁路缓存模式:缓存有就返回,没有数据库查询,放入缓存返回。 还有些常用缓存策略 读穿透模式 读穿透和旁路很相似,程序不需要关注从哪里读取数据,它只需要从缓存查询数据。…...
运动馆预约管理系统设计
设计一个运动馆预约管理系统,需要考虑到用户需求、系统功能、技术实现和用户体验等多个方面。以下是一个基本的设计框架: 1. 系统目标 提供便捷的运动场地预约服务。 实现运动馆资源的有效管理和利用。 支持在线支付,提高交易效率。 提供数…...
第五届计算机、大数据与人工智能国际会议(ICCBD+AI 2024)
随着科技的飞速发展,计算机、大数据和人工智能等前沿技术已成为推动社会进步的重要力量。为了加强这一领域的学术交流与合作,促进技术创新与发展,第五届计算机、大数据与人工智能国际会议(ICCBDAI 2024)将于2024年11月…...
高效的向量搜索算法——分层可导航小世界图(HNSW)
最近在接触大模型相关内容,发现一种高效的向量搜索算法HNSW,这里做一下记录。 在之前自己也接触过一段时间的复杂网络(网络科学),没想到,将网络科学的思想引入到向量搜索算法中,可以产生令人眼前…...
【MySQL备份】Percona XtraBackup全量备份实战篇
目录 1. 前言 2.准备工作 2.1.环境信息 2.2.创建备份目录 2.3.配置/etc/my.cnf文件 2.4.授予root用户BACKUP_ADMIN权限 3.全量备份 4.准备备份 5.数据恢复 6.总结 "实战演练:利用Percona XtraBackup执行MySQL全量备份操作详解" 1. 前言 本文…...
港口危险货物安全管理人员考试题库(含答案)
一、单选题 1.化学品安全标签内容中警示词有( )种分别进行危害程度的警示。 A、3 B、4 C、5 参考答案:A 2.运输放射性物品,应当使用( )的放射性物品运输包装容器(以下简称运输容器)。 A、专业 B、专用 C、统一 D、定制 参考答案:B 3.库区仪表及计算机监控管理系…...
什么是 JVM( Java 虚拟机),它在 Java 程序执行中扮演什么角色?
JVM,全称Java Virtual Machine,中文译作“Java虚拟机”,它是运行Java程序的软件环境,也是Java语言的核心部分之一。 想象一下,如果你是一位环球旅行家,每到一个新的国家,都需要学习当地的语言才…...
Python容器 之 列表--下标和切片
列表的切片 得到是 新的列表字符串的切片 得到是 新的字符串 如果下标 不存在会报错 list1 [1, 3.14, "hello", False] print(list1)# 获取 列表中 第一个数据 print(list1[0]) # 1# 获取列表中的最后一个数据 print(list1[-1]) # [False]# 获取中间两个数 即 3.1…...
Docker 运行Nacos无法访问地址解决方法
参考我的上一篇文章去配置好镜像加速器,镜像加速器不是配置越多越好,重试次数多了会失败 Dockerhub无法拉取镜像配置阿里镜像加速器-CSDN博客 错误的尝试 最开始按照网上的方式去配了一大堆,发现下不下来。 镜像源地址:https:…...
Stable Diffusion 商业变现与绘画大模型多场景实战
前言 ai绘画软件Stable Diffusion是一种通过模拟扩散过程,将噪声图像转化为目标图像的文生图模型,具有较强的稳定性和可控性,可以将文本信息自动转换成高质量、高分辨率且视觉效果良好、多样化的图像。在日常工作中,ai绘画软件St…...
[CocosCreator]CocosCreator网络通信:https + websocket + protobuf
环境 cocos creator版本:3.8.0 开发语言:ts 操作系统:windows http部分 直接使用 XMLHttpRequest 创建http请求 // _getHttpUrl 方法自己写字符串拼接public httpPostJsonRequest(uri: string, headData: any, data: any, cb: Function…...
并发控制-事务的调度、数据不一致问题(更新丢失、脏读、不可重复读)、非串行调度的的可串行化
一、引言 1、数据库管理系统DBMS的事务处理技术实现的另一个主要功能部分是并发控制机制。并发控制机制完成的功能就是对并发执行的事务进行控制,保证事务的隔离性,从而进一步保持数据库的一致性。 2、事务的并发控制就是对并发执行的不同事务中的数据…...
Golang | Leetcode Golang题解之第202题快乐数
题目: 题解: func isHappy(n int) bool {cycle : map[int]bool{4: true, 6: true, 37: true, 58: true, 89: true, 145: true, 42: true, 20: true}for n ! 1 && !cycle[n] {n step(n)}return n 1 }func step(n int) int {sum : 0for n > …...
算法:哈希表
目录 题目一:两数之和 题目二:判定是否互为字符重排 题目三:存在重复元素I 题目四:存在重复元素II 题目五:字母异位词分组 关于哈希表 哈希表就是存储数据的容器 哈希表的优势是:快速查找某个元素O(…...
自然语言处理基本知识(1)
一 分词基础 NLP:搭建了计算机语言和人类语言之间的转换 1 精确分词,试图将句子最精确的分开,适合文本分析 >>> import jieba >>> content "工信处女干事每月经过下属科室" >>> jieba.cut(content,cut_all …...
Java中的数据加密与安全传输
Java中的数据加密与安全传输 大家好,我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编,也是冬天不穿秋裤,天冷也要风度的程序猿!今天我们来探讨一下在Java中如何实现数据加密与安全传输。 随着互联网的普及和网络…...
UG NX二次开发(C++)-根据草图创建拉伸特征(UFun+NXOpen)
1、前言 UG NX是基于特征的三维建模软件,其中拉伸特征是一个很重要的特征,有读者问如何根据草图创建拉伸特征,我在这篇博客中讲述一下草图创建拉伸特征的UG NX二次开发方法,感兴趣的可以加入QQ群:749492565,或者在评论区留言。 2、在UG NX中创建草图,然后创建拉伸特征 …...
TS_开发一个项目
目录 一、编译一个TS文件 1.安装TypeScript 2.创建TS文件 3.编译文件 4.用Webpack打包TS ①下载依赖 ②创建文件 ③启动项目 TypeScript是微软开发的一个开源的编程语言,通过在JavaScript的基础上添加静态类型定义构建而成。TypeScript通过TypeScript编译器或…...
2024年华为OD机试真题-传递悄悄话 -C++-OD统一考试(C卷D卷)
2024年OD统一考试(D卷)完整题库:华为OD机试2024年最新题库(Python、JAVA、C++合集) 题目描述: 给定一个二叉树,每个节点上站着一个人,节点数字表示父节点到该节点传递悄悄话需要花费的时间。 初始时,根节点所在位置的人有一个悄悄话想要传递给其他人,求二叉树所有节…...
eclipse基础工程配置( tomcat配置JRE环境)
文章目录 I eclipse1.1 工程配置1.2 编译工程1.3 添加 JRE for the project build pathII tomcat配置JRE环境2.1 Eclipse编辑tomcat运行环境(Mac版本)2.2 Eclipse编辑tomcat运行环境(windows版本)2.3 通过tomcat7W.exe配置运行环境(windows系统)I eclipse 1.1 工程配置 …...
Spring Boot 学习第八天:AOP代理机制对性能的影响
1 概述 在讨论动态代理机制时,一个不可避免的话题是性能。无论采用JDK动态代理还是CGLIB动态代理,本质上都是在原有目标对象上进行了封装和转换,这个过程需要消耗资源和性能。而JDK和CGLIB动态代理的内部实现过程本身也存在很大差异。下面将讨…...
Linux[高级管理]——Squid代理服务器的部署和应用(传统模式详解)
🏡作者主页:点击! 👨💻Linux高级管理专栏:点击! ⏰️创作时间:2024年6月24日11点11分 🀄️文章质量:95分 目录 ————前言———— Squid功能 Squ…...
使用Vue 2 + Element UI搭建后台管理系统框架实战教程
后台管理系统作为企业内部的核心业务平台,其界面的易用性和功能性至关重要。Vue 2作为一个成熟的前端框架,以其轻量级和高效著称,而Element UI则是一套专为桌面端设计的Vue 2组件库,它提供了丰富的UI元素和组件,大大简…...
Carla安装教程
1.前言 对于从事自动驾驶的小伙伴而言,或多或少应该都接触过一些的仿真软件,今天要给大家介绍的这款仿真软件应该算的上是业界非常有名的一款仿真软件——carla。 目前carla的学习教程也还是蛮多的,但是写的都不是很全,在配置的…...
Elasticsearch 实现 Word、PDF,TXT 文件的全文内容提取与检索
文章目录 一、安装软件:1.通过docker安装好Es、kibana安装kibana:2.安装原文检索与分词插件:之后我们可以通过doc命令查看下载的镜像以及运行的状态:二、创建管道pipeline名称为attachment二、创建索引映射:用于存放上传文件的信息三、SpringBoot整合对于原文检索1、导入依赖…...
“深入解析:YUM仓库、RPM包与源码编译——Linux软件安装方式全面对比“
目录 YUM 仓库安装 概念: 优点: 缺点: RPM 包安装 概念: 优点: 缺点: 源码编译安装 概念: 优点: 缺点: 三者区别 YUM 仓库安装 概念: YUM&…...
安全与环境学报
《安全与环境学报》 创刊于2001年,是安全与环境学科的学术性月刊,国内外公开发行,刊号为ISSN 1009-6094、CN 11-4537/X,由北京理工大学、中国环境科学学会和中国职业安全健康协会主办,第十一、十二届全国人大常委会委员…...
【CSS】什么是CSS的columns属性
CSS的columns属性是一个简写属性,它允许你同时设置column-count(列数)和column-gap(列间隙)的值,用于在文本内容中创建多列布局。这个属性主要用于提高长文本内容的可读性和页面的美观性,通过将…...
看互联网大厂如何落地AI-Agent(3)
vivo一站式AI智能体构建平台的演进实践 引言 在AI技术的浪潮中,vivo互联网产品平台架构团队负责人张硕分享了vivo在构建一站式AI智能体平台方面的演进实践和深刻洞见。 背景与挑战 vivo面临的挑战包括创造商业价值、降低学习成本、合规性、以及LLM(大…...
LeetCode-简单-回文数
给你一个整数 x ,如果 x 是一个回文整数,返回 true ;否则,返回 false 。 回文数 是指正序(从左向右)和倒序(从右向左)读都是一样的整数。 例如,121 是回文,…...
HDFS,HBase,MySQL,Elasticsearch ,MongoDB分别适合存储什么特征的数据?
HDFS(Hadoop Distributed File System)通常用于存储大规模数据,适合存储结构化和非结构化数据,例如文本文件、日志数据、图像和视频等。 HBase是基于Hadoop的分布式数据库,适合存储大量非结构化和半结构化的数据&…...
用Spring Security快速实现 RABC模型案例
RABC模型通常是指“基于角色的访问控制”(Role-Based Access Control,RBAC)模型。这是一种广泛使用的访问控制机制,用于限制用户或系统对计算机或网络资源的访问。在RBAC模型中,权限与角色相关联,用户通过分…...
无线麦克风什么牌子的音质效果好?一文读懂无线领夹麦克风哪款好
在当今的数字时代,无线技术已经深入到我们生活的方方面面,无线领夹麦克风便是其中的佼佼者。它们为讲者、表演者以及那些需要在移动中讲话的人们提供了解放双手和自由移动的可能。本文旨在探讨无线领夹麦克风的多种用途,以及如何挑选最适合…...
python下将sqlite数据提取出来,转化为json数据
问题描述:我需要将sqlite数据提取出来做一部分处理,使用pandas,sqlite3库实现 大致的思路:使用sqlite3读取指定路径的数据,然后使用pandas.read_sql_query接收数据,然后to_dict,再写入到json文件…...
【算法】位运算算法——只出现一次的数字Ⅱ
题解:只出现一次的数字Ⅱ(位运算算法) 目录 1.题目2.题解:3.代码示例4.总结 1.题目 题目链接:LINK 要求:时间复杂度:O(N),空间复杂度:O(1) 2.题解: 3.代码示例 class Solution {…...
JavaScript与版本控制:编译时光机的双重奏——git仓库
JavaScript与版本控制:编译时光机的双重奏——git仓库 JavaScript:代码的魔法棒版本控制:时光机的钥匙案例一:初始化Git仓库与基本操作初始化仓库添加文件至暂存区提交更改分支管理 案例二:JavaScript项目中的Gitignor…...