自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(103)
  • 收藏
  • 关注

原创 deepseek本地部署

DeepSeek作为一款开源且性能强大的大语言模型,提供了灵活的本地部署方案,让用户能够在本地环境中高效运行模型,同时保护数据隐私,这里记录自己DeepSeek本地部署流程。

2025-02-06 22:20:45 492

原创 sqlfather笔记

这里简单记录写学习鱼皮sqlfather项目的笔记,以供以后学习。

2025-01-18 15:23:40 1003

原创 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

原创 Data数据无限滚动

Infinite Scroll无限滚动,当滚动至底部时,加载更多数据。

2024-11-10 11:14:16 318

原创 el-tab使用

el-tabs标签用于分割内容上有关联但属于不同类别的数据集合,选择不同的标签页时显示不同的内容。

2024-11-10 10:21:30 488

原创 解决路由缓存问题

使用带有参数的路由时,相同的组件实例被重复使用。因为两个路由都渲染同个组件,比起销毁再创建,服用则更显得高效,但是这也意味着组件的生命周期的钩子不会被调用。

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

原创 Vue3实现吸顶导航功能

需要实现当浏览器上下滚动时,若距离顶部的滚动距离大于78px,吸顶导航显示,小于78px隐藏。

2024-10-27 17:27:30 409

原创 Element-plus安装

我们建议您使用包管理器(如 NPM、Yarn 或 pnpm)安装 Element Plus,然后您就可以使用打包工具,例如 Vite 或 webpack。

2024-10-19 22:31:28 504

原创 Vue3 使用 pinia

Pinia是 Vue 的存储库,它允许您跨组件/页面共享状态,与vuex功能一样。

2024-10-08 22:43:04 1749

原创 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

原创 Vue Props传值

/ 定义一个接口,用来限制Teacher的属性// 一个自定义类型。

2024-09-21 13:15:33 647

原创 TS接口、泛型、自定义类型

/ 定义一个接口,用来限制Teacher的属性// 一个自定义类型。

2024-09-12 23:16:17 476

原创 后端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

原创 Vue setup语法糖

Vue setup语法糖使用简记

2024-08-31 00:21:59 1015

原创 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

原创 java 继承

这里简单记录下 java 中继承,方便日后学习。

2024-08-11 11:15:14 162

原创 Apache POI 实现 Excel 表格下载

这里以苍穹外卖中数据导出功能为例,记录下 Apache POI 导出 Excel 表格的过程。首先在 pom.xml 中导入相关依赖</</</</</</

2024-08-08 22:58:45 470

原创 Apache POI

这里简单记录下使用 POI 向 Excel 中写入 和 从Excel 中读取内容的过程,方便后续回忆。

2024-08-07 23:23:38 181

原创 LocalDate使用简记

日期类使用介绍

2024-08-04 20:22:27 231

原创 该文件没有与之关联的应用来执行该操作

搜了好多帖子说是注册表有问题,这里记录我自己解决这个问题的方式,其实很简单,就是在 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

原创 压缩和解压

-z, gzip模型,不使用-z就是普通的tarball格式。-z选项如果使用的话,

2024-07-09 00:03:17 219

原创 Linux环境变量

环境变量是一组信息记录,类型是KeyValue型(名称=值),用于操作系统运行的时候记录关键信息。

2024-07-06 21:50:46 391

原创 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关注的人

提示
确定要删除当前文章?
取消 删除