当前位置：首页 > news >正文

小程序-基础加强

news 来源：原创 2025/5/9 13:48:24

前言

这一节把基础加强讲完

1. 导入需要用到的小程序项目

在这里插入图片描述

2. 初步安装和使用vant组件库

在这里插入图片描述

这里还可以扫描二维码

在这里插入图片描述

其中步骤四没什么用
在这里插入图片描述

右键选择最后一个

在开始之前，我们的项目根目录得有package.json
没有的话，我们就初始化一个

在这里插入图片描述
但是我们没有npm这个命令，我们要先下载才行
https://nodejs.org/en/about/previous-releases
输入这个网址

https://nodejs.org/en/
或者这个网址

如果在浏览器上下载太慢的话，可以选择在迅雷上下载

这样就安装了

现在检验一下安装是否成功还是失败

查看node.js的版本号
终端输入node -v即可
cmd即可

在这里插入图片描述
这样就可以使用npm了

然后还要把这个nodejs的安装路径搞到环境变量中

在这里插入图片描述
这样查看安装路径

在这里插入图片描述
最后的安装路径就是那个exe文件，弄好了环境变量以后，就把电脑重启就可以了

在这里插入图片描述
这样就成功了，创建了一个包管理配置文件，名字叫做package.json

在这里插入图片描述
这时就可以把这个命令拿过去了

在这里插入图片描述
记得还要指定版本号

本地设置那里没有的话，可以不用勾

在这里插入图片描述

在这里插入图片描述
这样就把button的组件进行引入了
而且这时全局的引入

在这里插入图片描述

在这里插入图片描述

3. 使用css变量定制vant主题样式

在这里插入图片描述

这样就变了

第一使用page这个节点，因为要让自己变量全局生效，所以我们使用page这个根节点
每个页面的根节点都是page的在这里插入图片描述
所以用page，每个页面都可以访问了
第二就是为什么用这个名字–button-danger-background-color就可以改变了
因为这是官方文档告诉的

点一下配置文件
会进入github

这里就是和按钮相关的变量了

在这里插入图片描述

@要改为–

在这里插入图片描述

4. 小程序API的Promise化

在这里插入图片描述

在小程序中每安装完一个包，都需要对这个包重新进行构建

在这里插入图片描述
每次安装一个包，都会把包安装到这里

我们要把包迁移到miniprogram_npm这个目录下才行

在这里插入图片描述

miniprogram_npm这个下面目前只有一个包
所以我们还要构建，每次构建都要删除miniprogram_npm这个目录

shift+delete强制删除

在这里插入图片描述
点击构建npm

这样就有了这个包了，现在就可以使用了这个包了

在这里插入图片描述
将wx promise化为wxp或者wx.p

在这里插入图片描述

在这里插入图片描述

然后继续优化方法

在这里插入图片描述
我不知道我这里为什么不行

这里打印出来的应该是Data

5.全局数据共享

在这里插入图片描述

在这里插入图片描述

6. 全局数据共享-创建Store实例并定义计算属性与actions方法

在这里插入图片描述
创建一个文件夹store，专门用来存储mobx

在这里插入图片描述

在这里插入图片描述

get表示这个是只读的

在这里插入图片描述

7. 全局数据共享-在页面中使用store中的成员

在这里插入图片描述
我们在消息页面使用store里面的数据

这是清理工作

这样就把成员绑定到页面上了

在这里插入图片描述

在这里插入图片描述

找寻原因

8. 全局数据共享-在组件中使用store中的成员

在这里插入图片描述

先创建一个组件

在这里插入图片描述
然后在app.json里面注册这个组件

在这里插入图片描述
而且页面里面的值也会跟着变化

9. 分包的基础概念

在这里插入图片描述

在这里插入图片描述

10. 分包的基本用法

在这里插入图片描述
pages页面下的就适合放在主包里面

这里写分包的目录，小程序会自动生成的

在这里插入图片描述
一保存就会自动生成了

在这里插入图片描述

在这里插入图片描述
root是分包的根目录
name是分包的别名

这样p1就是第一个分包
如何知道分包的体积呢

在这里插入图片描述
这样就可以查看了

11. 独立分包

在这里插入图片描述

在这里插入图片描述

这样pkgB就是独立分包了

在这里插入图片描述

12. 分包预下载

在这里插入图片描述

现在我们希望在进入contact页面的时候，自动下载pkgA页面

这里可以切换网络

在这里插入图片描述
我们这个改为4G就失败了

在这里插入图片描述

13. 在app.json中定义tabBar的配置信息

在这里插入图片描述

在这里插入图片描述

只需要在app.json声明custom就可以了

在这里插入图片描述
然后就是list数组还要保留

所以list节点还要保留，第一是兼容低版本，第二就是区分哪些页面是tab页面

14. 初步实现自定义的tabBar效果

在这里插入图片描述

在根目录新建文件夹
在这里插入图片描述
然后就是在里面创建index组件

然后就变成这样了

最下面的那串数据来自index.html
在这里插入图片描述
我们可以用vant

这个就很好了

在这里插入图片描述
这就是引入

在这里插入图片描述

active就是每个索引的值
然后我们开始结合list里面的图标

这里就可以自定义图标了

右上角的数字就是info的值

icon-active就是未选中的图标
icon就是选中时候的图标

在这里插入图片描述

我们把list弄到index.js中的Data里面
然后我们就可以用for来搞出对应的tabBar图标了

在这里插入图片描述

然后在改一下大小

在这里插入图片描述

15. 渲染tabBar上的数字徽标

在这里插入图片描述

可以看出这个2超出了灰线，所以美化
把图标与字体之间的间隙弄为0就可以了

这里的空隙就是这里来的，我们在点一下就可以了

就是要干掉这个黄色的部分

把这个margin-bottom值设置为0就可以了

在这里插入图片描述
它的父的类名是van-tabbar-item可以来操作

在这里插入图片描述
但是好像没有生效

所以我们要覆盖vant的样式得开启styleIsolation: ‘shared’

这个距离就变小了

现在我们只给消息页面搞上徽标

在这里插入图片描述
我们先给消息页面加上一个属性info

info="{{item.info?item.info:‘’}}这是一个三元的判断

info为0就不会有徽标
但是info写死了
现在我们的info就写成sum的值
sum的值是store里面的，所以要数据绑定到组件中
我们可以查看官方文档

在这里插入图片描述

或者我们前面讲过的

第一步

在这里插入图片描述
这是第二步

这是第三步

这就把store里面的sum映射过来了

我们可以用数据监听器监听sum的变化
在这里插入图片描述
这里更改一下

在这里插入图片描述
这样就可以了

在这里插入图片描述

16. 实现tabBar页面的切换效果

在这里插入图片描述
先补全一下根路径

在这里插入图片描述
这样就可以了

在这里插入图片描述

但是底部的选中效果有点问题，不是对应的

在这里插入图片描述
我们最好把这个active定义在store里面
因为每次点击active都变成0了

把active先干掉
在这里插入图片描述

在这里插入图片描述

然后就是映射到index.js中

在这里插入图片描述

在这里插入图片描述
然后点击产生change事件，要更新active的索引

先把对应更改store里面的active的方法映射过来

在这里插入图片描述

这样就可以了

在这里插入图片描述
这样就成功了

17. 修改tabBar选中项文本的颜色值

在这里插入图片描述
active-color就可以设置了

其中颜色我们可以用取色器来设置
在这里插入图片描述
这样就变颜色了

总结

下一节开始讲对应的项目了

相关文章：

小程序-基础加强

前言这一节把基础加强讲完 1. 导入需要用到的小程序项目 2. 初步安装和使用vant组件库这里还可以扫描二维码其中步骤四没什么用右键选择最后一个在开始之前，我们的项目根目录得有package.json 没有的话，我们就初始化一个但是我们没有npm这个…...

编程日记 2025/5/9 13:48:24

vscode+CMake+Debug实现及权限不足等诸多问题汇总

环境说明有空再补充直接贴两个json tasks.json {"version": "2.0.0","tasks": [{"label": "cmake","type": "shell","command": "cmake","args": ["../"…...

编程日记 2025/5/7 5:19:44

零基础Vue入门6——Vue router

本节重点： 路由定义路由跳转前面几节学习的都是单页面的功能（都在专栏里面https://blog.csdn.net/zhanggongzichu/category_12883540.html），涉及到项目研发都是有很多页面的，这里就需要用到路由（vue route…...

编程日记 2025/5/5 20:34:05

【疑海破局】一个注解引发的线上事故

【疑海破局】一个注解引发的线上事故 1、问题背景在不久前一个阳光明媚的上午，我的思绪正在代码中游走、双手正在键盘上飞舞。突然，公司内部通讯工具上，我被拉进了一个临时工作群，只见群中产品、运营、运维、测试等关键人员全部严阵以待，我就知道大的可能要来了。果不其…...

编程日记 2025/5/2 21:49:02

C语言：函数栈帧的创建和销毁

目录 1.什么是函数栈帧2.理解函数栈帧能解决什么问题3.函数栈帧的创建和销毁的过程解析3.1 什么是栈3.2 认识相关寄存器和汇编指令3.3 解析函数栈帧的创建和销毁过程3.3.1 准备环境3.3.2 函数的调用堆栈3.3.3 转到反汇编3.3.4 函数栈帧的创建和销毁 1.什么是函数栈帧在写C语言…...

编程日记 2025/5/5 1:28:00

IDEA启动项目慢问题处理

IDEA启动项目慢问题处理一、问题现象二、问题排查排查点1：idea内存排查点2：应用内存排查点3：shorten command lineclasspath filejar manifest 排查点4：jstack排查三、问题定位一、问题现象多模块工程，启动模块为…...

编程日记 2025/5/6 8:52:14

Denavit-Hartenberg DH MDH坐标系

Denavit-Hartenberg坐标系及其规则详解 6轴协作机器人的MDH模型详细图_6轴mdh-CSDN博客 N轴机械臂的MDH正向建模，及python算法_mdh建模-CSDN博客运动学3-----正向运动学 | 鱼香ROS 机器人学：MDH建模 - 哆啦美 - 博客园机械臂学习——标准DH法和改进MDH…...

编程日记 2025/5/5 23:14:58

Unity 快速入门 1 - 界面操作

本项目将快速介绍 Unity 6的基本操作和功能，下载附件的项目，解压到硬盘，例如 D:\Unity Projects\， 注意整个文件路径中只有英文、空格或数字，不要有中文或其他特殊符合。 1. 打开Unity Hub，点击右上角的 O…...

编程日记 2025/5/4 17:56:18

美国网络司令部军事网络指挥框架战略转型与挑战分析

文章目录前言一、框架核心内容：从分散到集中，构建标准化作战体系二、指挥体系重构：权责明晰与集中化管控三、风险管理创新：从被动防御到主动备战四、对美军网络作战的影响总结前言 2024年9月，美国网络司令部发布《国…...

编程日记 2025/5/5 15:05:06

9-收纳的知识

[ComponentOf(typeof(xxx))]组件描述，表示是哪个实体的组件 [EntitySystemOf(typeof(xxx))] 系统描述 [Event(SceneType.Demo)] 定义事件，在指定场景的指定事件发生后触发 [ChildOf(typeof(ComputersComponent))] 标明是谁的子实体 [ResponseType(na…...

编程日记 2025/5/8 10:28:32

Linux 压缩打包

Linux压缩打包文章目录 Linux压缩打包压缩的意义和原理压缩的意义压缩的原理压缩与解压缩的好处压缩打包命令.zipzip 命令用法unzip 的用法.gzgzip 的用法gunzip 的用法.bz2bzip2 的用法bunzip2 的用法.xzxz 命令用法tar04-Linux压缩打包课后习题压缩的意义和原理压缩的意义…...

编程日记 2025/5/9 9:44:52

排序算法--堆排序

堆排序是一种高效的排序算法，适合大规模数据排序，尤其适用于需要实时获取最大（或最小）值的场景。 // 交换两个元素的值 void swap(int* a, int* b) {int temp *a;*a *b;*b temp; }// 调整堆，使其满足堆的性质 void …...

编程日记 2025/5/5 17:12:07

51c视觉~CV~合集10

我自己的原文哦~ https://blog.51cto.com/whaosoft/13241694 一、CV创建自定义图像滤镜热图滤镜这组滤镜提供了各种不同的艺术和风格化光学图像捕捉方法。例如，热滤镜会将图像转换为“热图”，而卡通滤镜则提供生动的图像，这些图像看起来…...

编程日记 2025/5/4 12:22:53

【数据结构】(6) LinkedList 链表

一、什么是链表 1、链表与顺序表对比不同点LinkedListArrayList物理存储上不连续连续随机访问效率O(N)O(1）插入、删除效率O(1)O(N) 3、链表的分类链表根据结构分类，可分为单向/双向、无头结点/有头节点、非循环/循环链表，这三组每组各取…...

编程日记 2025/5/4 22:54:48

使用 Axios 获取用户数据并渲染——个人信息设置

目录 1. HTML 部分（前端页面结构） HTML 结构解析： 2. JavaScript 部分（信息渲染逻辑） JavaScript 解析： 3. 完整流程 4. 总结 5. 适用场景本文将介绍如何通过 Axios 从服务器获取用户信息&#xff0…...

编程日记 2025/5/6 5:32:50

【hudi】基于hive2.1.1的编译hudi-1.0.0源码

hudi版本1.0.0 需要使用较低版本的hive，编译hudi只需要修改下类即可： org.apache.hudi.hadoop.hive.HoodieCombineHiveInputFormat 一、复制org.apache.hadoop.hive.common.StringInternUtils 找个hive2.3.9的源码包，创建包路径&#xff0c…...

编程日记 2025/5/4 12:38:05

物联网领域的MQTT协议，优势和应用场景

MQTT（Message Queuing Telemetry Transport）作为轻量级发布/订阅协议，凭借其低带宽消耗、低功耗与高扩展性，已成为物联网通信的事实标准。其核心优势包括：基于TCP/IP的异步通信机制、支持QoS（服务质量&…...

编程日记 2025/5/7 1:47:29

MyBatis 调优指南：释放持久层性能潜力

MyBatis 作为一款优秀的持久层框架，以其灵活性和易用性深受开发者喜爱。然而，随着应用规模扩大和数据量增长，MyBatis 的性能问题也逐渐显现。本文将深入探讨 MyBatis 调优策略，帮助您释放持久层性能潜力。一、 SQL 语句优化避免…...

编程日记 2025/5/7 8:53:57

Unity扩展编辑器使用整理（一）

准备工作在Unity工程中新建Editor文件夹存放编辑器脚本， Unity中其他的特殊文件夹可以参考官方文档链接，如下： Unity - 手册：保留文件夹名称参考 (unity3d.com) 一、菜单栏扩展 1.增加顶部菜单栏选项使用MenuItem&#xff…...

编程日记 2025/5/8 17:19:53

注册中心不知选哪个？Zookeeper、Eureka、Nacos、Consul和Etcd 5种全方位剖析对比

本文给大家讲解 5 种常用的注册中心，对比其流程和原理，无论是面试还是技术选型，都非常有帮助。对于注册中心，在写这篇文章前，我其实只对 ETCD 有比较深入的了解，但是对于 Zookeeper 和其他的注册中心了解甚…...

编程日记 2025/5/8 0:33:02

Windows下怎么安装FFFmpeg呢？

在Windows下使用Open-webui报错，说Couldnt find ffmpeg or avconv,解决open-webui报错Couldn‘t find ffmpeg or avconv-CSDN博客于是尝试解决问题，那么Windows下怎么安装FFFmpeg呢？ 尝试了两种方法。第一种方法pip安装（失败&…...

编程日记 2025/5/7 10:37:17

CSS 基础：层叠、优先级与继承

CSS 基础：层叠、优先级与继承一、层叠（Cascade）示例：层叠的顺序二、优先级（Specificity）优先级规则示例：优先级的比较三、继承（Inheritance）哪些属性会被继承&#xf…...

编程日记 2025/5/9 4:07:15

《翻转组件库之发布》

背景继《翻转组件库之打包》_杨晓风-linda的博客-CSDN博客之后，组件库已经可以正常构建，那如何像elementUI等组件库那样，用npm安装，按照既定的用法使用即可呢？本篇便为你揭晓资料相关 1、npm官方文档：…...

编程日记 2025/5/9 3:25:47

Spring Boot + Spring AI快速体验

Spring AI快速体验 1 什么是Spring AI 主要功能 2 快速开始 2.1 版本说明2.2 配置文件2.3 pom依赖 2.3.1 spring maven仓库2.3.2 核心依赖 2.4 定义ChatClient2.5 启动类2.6 测试 3 参考链接 1 什么是Spring AI Spring AI是Spring的一个子项目，是Spring专门面向于…...

编程日记 2025/5/7 5:41:33

windows linux常用基础命令

windows基础命令 cd …/ （访问D盘直接D: 进入目录cd…\baidudu) color 2 改变颜色 dir 浏览当前目录中有什么内容例如 dir windows可以浏览windows中有什么文件 cls 清屏 cd windows 可以跳转到c盘目录的下面 cd…/可以返回到上一级目录 ./当前目录 cd \ 直…...

编程日记 2025/5/8 11:29:54

ZooKeeper单节点详细部署流程

ZooKeeper单节点详细部署流程文章目录 ZooKeeper单节点详细部署流程一.下载稳定版本**ZooKeeper**二进制安装包二.安装并启动**ZooKeeper**1.安装**ZooKeeper**2.配置并启动**ZooKeeper** ZooKeeper 版本与 JDK 兼容性3.检查启动状态4.配置环境变量三.可视化工具管理**Zooke…...

编程日记 2025/5/5 17:26:03

【AI日记】25.02.06

【AI论文解读】【AI知识点】【AI小项目】【AI战略思考】【AI日记】【读书与思考】 AI kaggle 比赛：Backpack Prediction Challenge 读书书名：理解公司：产权、激励与治理作者：张维迎下图感想：哲学家、思想家比如卢梭…...

编程日记 2025/5/9 13:07:23

税费学习之：附加税费

好的！我将从 **税收本质、历史沿革、用途逻辑、企业影响** 四个维度综合分析，用项目管理中的实际场景说明为什么需要缴纳附加税费。 --- ### **一、附加税费的本质与构成** #### **1. 定义** 附加税费是 **以增值税、消费税为基数征收的附加税**&…...

编程日记 2025/5/1 4:19:56

数据库开发常识（10.6）——SQL性能判断标准及索引误区（1）

10.6. 数据库开发常识作为一名专业数据库开发人员，不但需要掌握数据库开发相关的语法和功能实现，还要掌握专业数据库开发的常识。这样，才能在保量完成工作任务的同时，也保质的完成工作任务，避免了为应用的日后维护埋下性能和稳定性方面的隐患。可遗憾的是，现实中，很大…...

编程日记 2025/5/9 0:13:43

网络原理一＞数据链路层协议-＞以太网协议

目录以太网协议的结构：类型：ARP请求应答报文：CRC：MTU: 为什么需要mac地址：mac地址和IP地址的区别： 以太网协议的结构： 以太网是数据链路层和物理层的主要协议源IP，目的IP就不多说…...

编程日记 2025/5/8 4:28:31

Android 约束布局ConstraintLayout整体链式打包居中显示

Android 用约束布局ConstraintLayout实现将多个控件视作一个整体居中显示，使用 app:layout_constraintHorizontal_chainStyle"packed"实现 chain 除了链条方向有横向和竖向区分外， chain链条上的模式有 3种 spread - 元素将被展开&#…...

编程日记 2025/5/9 13:35:13

云计算行业分析

云计算作为数字经济的核心基础设施，未来十年将持续重塑全球科技格局，并渗透到几乎所有行业的数字化转型中。一、云计算的发展潜力 1. 技术融合驱动爆发式创新 AI与云计算的深度耦合 - **智能云服务**：云厂商将提供预训练模型、自动化ML工…...

编程日记 2025/4/14 13:16:18

深入浅出DeepSeek LLM 以长远主义拓展开源语言模型

深入浅出地讲解DeepSeek LLM 以长远主义拓展开源语言模型 🌟 1. 什么是 DeepSeek LLM？ 大家想象一下，你在游戏里要打造一个超级英雄角色，选择最强的装备、技能点和升级策略。那么，DeepSeek LLM 就是 AI 界的“超级英雄…...

编程日记 2025/4/29 17:16:43

用Python获取股票数据并实现未来收盘价的预测

获取数据先用下面这段代码获取上证指数的历史数据，得到的csv文件数据，为后面训练模型用的 import akshare as ak import pandas as pd# 获取上证指数历史数据 df ak.stock_zh_index_daily(symbol"sh000001")# 将数据保存到本地CSV文件 df.…...

编程日记 2025/4/24 5:46:28

[openwrt]openwrt slaac only模式下部分终端无法获取到IPv6 DNS

问题描述 OpenWrt 中，如果启用了 RA 单播（ra_unicast），但部分终端无法获取到 DNS 信息问题分析 RA 单播的局限性并非所有终端都完全支持通过单播接收 RA 消息。部分终端可能无法正确解析单播 RA 中的 RDNSS（Recursive DNS Server）选项，从而导致无法获取 DNS 信息。终…...

编程日记 2025/5/2 1:23:55

【redis】数据类型之list

Redis的List数据类型是一个双向链表，支持在链表的头部（left）和尾部（right）进行元素的插入（push）和弹出（pop）操作。这使得List既可以用作栈（stack）…...

编程日记 2025/5/8 15:16:52

电脑连接wifi但是浏览器打开不了网页，使用手机热点能正常使用

电脑连接wifi但是浏览器打开不了网页，使用手机热点能正常使用打开控制面板打开网络和Internet（查看网络状态和任务） 点击更改适配器设置双击WLAN 点击属性并双击打开Internet 协议版本4（TCP/IPv4） 将自动…...

编程日记 2025/5/7 20:15:29

el-table中的某个字段最多显示两行，超出部分显示“...详情”，怎么办

文章目录背景需求需求分析解决方案在线体验灵感来源我的实现方案总结背景需求比如，有如下一个表格，请你实现它： 要求： 最多显示两行超出部分显示为：“…详情”点击详情，展开全部内容说明&#x…...

编程日记 2025/5/7 8:47:55

Vue el-input密码输入框按住显示密码，松开显示*；阻止浏览器密码回填，自写密码输入框；校验输入非汉字内容；文本框聚焦到内容末尾；

输入框功能集合 <template><div style"padding: 10px"><el-input:type"inputType"v-model"password"placeholder"请输入密码"auto-complete"new-password"id"pwd"style…...

编程日记 2025/5/6 17:20:35

尚硅谷课程【笔记】——大数据之Shell【一】

课程视频：【【尚硅谷】Shell脚本从入门到实战】一、Shell概述为什么要学习Shell？ 1）需要看懂运维人员的Shell程序 2）偶尔编写一些简单的Shell程序来管理集群、提高开发效率什么是Shell？ 1）Shell是一…...

编程日记 2025/5/5 17:19:08

4年测试｜20-30K｜金山办公｜大模型测开3轮面经

一面时间：面试时长一小时左右二面时间：面试时长基本满一小时 HR面时间：面试流程上全部结束了，内容如下： 前言： 岗位：自己想投递base珠海，金山办公的HR捞了下。why choose Zhuha…...

编程日记 2025/5/4 17:56:20

【负载均衡式在线OJ】实现负载均衡

目录管理服务器增加负载 && 减少负载重置负载 && 获得负载负载均衡添加配置信息什么是负载均衡如何实现？ 管理服务器增加负载 && 减少负载客户端访问一次服务器，负载就加1。客户端结束访问服务器，…...

编程日记 2025/5/2 1:24:11

网络安全-防御第一次作业（由于防火墙只成功启动了一次未补截图）

防火墙安全策略课堂实验报告一、拓扑本实验拓扑包含预启动设备、DMZ区域（含OA Server和Web Server）、防火墙（FW1）、Trust区域（含办公区PC和生产区PC）等。具体IP地址及连接关系如给定拓扑图所示&#xf…...

编程日记 2025/5/9 7:49:12

大数据挖掘--两个角度理解相似度计算理论

文章目录 0 相似度计算可以转换成什么问题1 集合相似度的应用1.1 集合相似度1.1文档相似度1.2 协同过滤用户-用户协同过滤物品-物品协同过滤 1.2 文档的shingling--将文档表示成集合1.2.1 k-shingling1.2.2 基于停用词的 shingling 1.3 最小哈希签名1.4 局部敏感哈希算法&#…...

编程日记 2025/5/8 3:53:28

【Mybatis Plus】JSqlParser解析sql语句

【Mybatis Plus】JSqlParser解析sql语句【一】JSqlParser 是什么【二】JSqlParser 的安装步骤【三】使用场景【1】sql语句解析【2】SQL 语句转换【3】SQL 语句生成【4】SQL 语句验证【四】在使用 JSqlParser 时，如何处理 SQL 注入攻击？【1】使用预编译…...

编程日记 2025/5/6 23:14:17

vue3 + ElementPlus 封装列表表格组件包含分页

在前端开发中，封装组件是必不可少的。今天就来封装一个通用的列表表格组件，包含分页功能，可以提高代码的复用性和可维护性。 1. 组件设计 Props： tableData：表格数据。columns：表格列配置。total&#xff…...

编程日记 2025/5/8 14:58:00

springboot3整合knife4j详细版，包会！（不带swagger2玩）

1. 引入依赖 <dependency><groupId>com.github.xiaoymin</groupId><artifactId>knife4j-openapi3-jakarta-spring-boot-starter</artifactId><version>4.4.0</version> </dependency>2. 配置文件简短必要版 # 配置springd…...

编程日记 2025/5/6 3:42:23

Vue2自定义指令实现优雅的前端埋点方案

背景介绍在前端开发中，埋点是一个非常常见的需求。通常我们需要记录用户的操作行为，以便于后续的数据分析和问题排查。传统的埋点方式往往是在每个需要埋点的地方都写一段上报代码，这样不仅代码重复度高，而且维护起来也比较麻烦…...

编程日记 2025/5/1 1:28:06

1.攻防世界题目名称-文件包含

进入题目页面如下直接给出了源码进行代码审计题目给出提示是文件包含的题代码审计 <?php // 高亮显示当前 PHP 文件的源代码，方便查看和调试 highlight_file(__FILE__);// 包含名为 "check.php" 的文件，通常这个文件中可能包含一些用…...

编程日记 2025/5/4 20:27:25

Ruby Dir 类和方法详解

Ruby Dir 类和方法详解引言在Ruby编程语言中，Dir类是一个非常有用的工具，它允许我们与文件系统进行交互，如列出目录内容、检查文件是否存在等。Dir类提供了多种方法，使得文件系统的操作变得简单且高效。本文将详细介绍Ruby中的…...

编程日记 2025/5/8 20:20:14