- 博客(103)
- 收藏
- 关注
原创 deepseek本地部署
DeepSeek作为一款开源且性能强大的大语言模型,提供了灵活的本地部署方案,让用户能够在本地环境中高效运行模型,同时保护数据隐私,这里记录自己DeepSeek本地部署流程。
2025-02-06 22:20:45
492
原创 zookeeper分布式锁模拟12306买票
在连接zookeeper时候出现下面这个错误,刚开始以为是服务端zookeeper出问题了,但是检查后发现没问题,在服务端可正常创建、修改节点信息。期间还遇到了一个小插曲,这里顺便记录下。解决方案:关闭服务器防火墙。
2024-12-22 10:07:26
333
原创 vue计时器
实现一个倒计时功能用于下单后的计时代码倒计时组件import { ref, onUnmounted } from 'vue'import { computed } from 'vue'import dayjs from 'dayjs'export const useCountDown = () => { // 响应式数据 let timer = null const time = ref(0) // 格式化为时分秒 const formatTim
2024-12-13 22:31:49
759
原创 Pinia管理用户数据
Pinia 是 Vue3 的新一代状态管理库,提供了更简单的 API 和更好的 TypeScript 支持。它作为 Vuex 的替代方案,成为了管理 Vue 应用状态的首选。Pinia 是 Vue3 的新一代状态管理库。与 Vuex 相比,Pinia 提供了更简单的 API、更好的性能,并且完全支持 Vue3 的组合式 API 和 TypeScript。Pinia 的设计理念是尽量简化状态管理,减少不必要的复杂性,使开发者能够专注于业务逻辑的实现。这篇文章用来记录怎样使用Pinia实现保存用户数据。
2024-11-30 21:39:55
422
原创 表单校验规则
这里简单记录下vue使用表单时候,给表单添加校验规则,直接上代码<script setup> import { ref } from 'vue' // 定义表单对象 const form = ref({ account: '', password: '' }) // 定义表单验证规则 const rules = { account: [ {required: true, m
2024-11-24 21:25:51
1021
原创 通用组件统一注册全局
例如这里想要将components文件夹中的组件进行全局配置可通过以下方式。配置完成后就可在文件中直接使用,而不用导入。修改main.js文件。
2024-11-24 10:11:20
298
原创 小图切换大图及放大镜实现
实现类似淘宝京东平台图片预览功能,鼠标放在右侧图片上时,左侧会实时显示右侧图片。鼠标放在左侧大图上时候实现放大镜效果,查看图片细节。
2024-11-23 23:32:33
1007
原创 vue渲染模板遇到多层属性访问
[1].id} 在取[1]之前先?一下,若categories有值,然后才再去取值,即 .[1]。2. 第二种方式就是用v-if的方式,当有值的时候才去取值。这种值的,因此可以用可选链的方式,时候不要直接写,因为若。1.可选链,例如获取。
2024-11-15 00:11:20
629
原创 解决路由缓存问题
使用带有参数的路由时,相同的组件实例被重复使用。因为两个路由都渲染同个组件,比起销毁再创建,服用则更显得高效,但是这也意味着组件的生命周期的钩子不会被调用。
2024-11-09 10:34:16
431
原创 EL面包屑导航实现
el-breadcrumb 是 Element Plus 中的面包屑导航组件,主要用于展示当前页面在整个应用程序中的位置,并提供导航功能。
2024-11-05 23:34:16
918
原创 vue3图片懒加载
界面很长,屏幕不能一下装下所有内容,如果以进入首页就把所有内容都加载完的话所需时间较长,会影响用户体验,所以可以当用户浏览到时再去加载。
2024-11-03 17:57:35
659
1
原创 el-carousel 轮播图
importfrom;constref;log;;height;position;left;top;z-index;imgheight;width;</
2024-10-31 23:38:01
333
原创 Element-plus安装
我们建议您使用包管理器(如 NPM、Yarn 或 pnpm)安装 Element Plus,然后您就可以使用打包工具,例如 Vite 或 webpack。
2024-10-19 22:31:28
504
原创 vue3路由
新建router文件夹,编写index.ts文件// 第一步:引入createRouter、createWebHashHistory// 第二步:引入组件// 第三步:创建路由实例routes:[},},})// 第四步:导出路由实例。
2024-09-26 23:11:19
607
原创 vue3自定义hooks
/ 数据]);// 方法try {debugger;// 返回数据和方法return {dogList,getDogList。
2024-09-23 23:04:29
873
原创 后端Controller获取成功,但是前端报错404
今天要做一个查看详情功能,debug时候能够成功进入到对应的Controller方法,Contorller方法里面也能得到对应的数据,但是前端页面一直报错404,显示对应的Controller方法路径找不到。
2024-09-12 15:18:05
649
原创 标签的ref属性
当我们想要获取一个标签对应的 DOM 元素的时候在 JavaScript 中,我们通过 document.getElementById() 来借助类选择器的写法获取,但是在 Vue 中,我们的 DOM 元素是挂载在同一个网页上的,这些名称难免会重复,所以需要别的方式去获取,给标签添加ref属性正好可以解决这个问题。
2024-09-09 23:30:57
1218
原创 watch监视与watchEffect监视
什么是watchwatch 的作用是用于监测响应式属性的变化,并在属性发生改变时执行特定的操作,它是 Vue 中的一种响应式机制,允许你在数据发生变化时做出相应的响应,执行自定义的逻辑。watch 使得在响应式属性变化时能够有更多的控制权和灵活性,让你的组件能够更好地响应数据的变化并执行相应的逻辑。watch() 默认是懒侦听的,即仅在侦听源发生变化时才执行回调函数。监听数据类型1.一个 ref() 定义的响应式数据2. 一个 reactive() 定义的响应式数据3. 一个getter 函数
2024-09-08 23:02:15
835
原创 Compute 计算属性
当我们有时候需要将模版中的某一个数据进行一系列处理后从而得到一个新的值,虽然 Vue 的模版中能够支持我们写一些表达式但是这样会使得我们的模板变得臃肿且不够灵活定制化,所以 Vue 也并不推荐我们在模板中写太多的表达式。因此 Vue 推荐我们使用计算属性(computed)来描述依赖响应式状态的复杂逻辑。当其依赖的属性的值发生变化时,计算属性会重新计算,反之,则使用中的属性值。
2024-09-02 23:29:40
1195
原创 ref 和 reactive 区别
前言ref 和 reactive是Vue 3中响应式编程的核心。在Vue中,响应式编程是一种使数据与UI保持同步的方式。当数据变化时,UI会自动更新,反之亦然。这种机制大大简化了前端开发,使我们能够专注于数据和用户界面的交互,而不必手动处理DOM更新。refref是Vue 3中的一个简单响应式API,用于创建一个包装基本数据类型的响应式引用(也可以包装复杂类型,只不过底层还是由reactive的方式实现的)。它的主要优点是能够轻松包装基本数据类型,并且具有清晰的访问和更新方式ref创建基本类型的响应
2024-08-31 16:17:02
1396
2
原创 WebSocket简介
WebSocket 是一种在单个TCP连接上进行全双工通信的协议。WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接, 并进行双向数据传输。下面借用一张图来说明HTTP与WebSocket的区别WebSocket是双向通信协议,模拟Socket协议,可以双向发送或接受信息,而HTTP是单向的。
2024-08-25 15:06:04
819
原创 Java的jdk配置成功,但是输入java -version等,命令行没有任何反应
Java下载后,手动配置环境变量,并且配置好,但是在命令行中无论输入java的什么都没有反应。
2024-08-17 00:29:42
367
1
原创 Apache POI 实现 Excel 表格下载
这里以苍穹外卖中数据导出功能为例,记录下 Apache POI 导出 Excel 表格的过程。首先在 pom.xml 中导入相关依赖</</</</</</
2024-08-08 22:58:45
470
原创 该文件没有与之关联的应用来执行该操作
搜了好多帖子说是注册表有问题,这里记录我自己解决这个问题的方式,其实很简单,就是在 tomcat 配置那里,不要选择 default, 给它指定一个浏览器就好。这里记录一下在使用 IDEA 运行 Web 项目时候遇到的一个错误。
2024-08-01 23:28:29
362
原创 SpringBoot缓存注解使用
除了 RedisTemplate 外, 自Spring3.1开始,Spring自带了对缓存的支持。我们可以直接使用Spring缓存技术将某些数据放入本机的缓存中;Spring缓存技术也可以搭配其他缓存中间件(如Redis等)进行使用,将某些数据写入到缓存中间件(缓存中间件可能在其他机器上)中。
2024-07-20 14:48:34
578
原创 Linux进程管理
语法: ps [-e -f]选项: -e ,显示出全部的进程选项: -f ,以完全格式化的形式展示信息(展示全部信息)一般来说,固定用法就是: ps -ef列出全部进程的全部信息。也可配合管道符 | 使用。ps -ef | grep 关键字上述语句可过滤指定关键字进程信息。
2024-07-05 23:01:44
407
原创 Linux 端口
计算机程序之间的通讯,通过IP只能锁定计算机,但是无法锁定具体的程序。通过端口可以锁定计算机上具体的程序,确保程序之间进行沟通。IP地址相当于小区地址,在小区内可以有许多用户(程序),而门牌号(端口)就是各个住户(程序)的联系地址。如图,若计算机A和计算机B要通讯,通过IP地址即可。计算机A上的程序和计算机B上的程序要通讯,就要通过端口。
2024-07-05 22:48:08
444
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人