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

vue3封装全局方法

news 来源：原创 2025/5/16 17:01:49

场景：各个模块详情中存在附件列表数据，需要再每个中添加一个预览附件的方法，是后期提出的需求，所以要在每个模块中进行添加，就去将预览方法封装一下。

将公共方法封装在utils下

utils/filePreview.ts

import router from '@/router'; // 引入路由实例/*** 文件预览公共方法* @param {Object} row - 当前文件数据*/
export function filePreview(row) {localStorage.setItem('filedata', JSON.stringify(row)); // 将文件数据存储到 localStorage 中const url = `${window.location.origin}${router.options.base || ''}/filePreview`; // 构造跳转 URLconst link = document.createElement('a'); // 创建 a 标签link.href = url;link.target = '_blank'; // 新窗口打开link.click(); // 触发点击事件
}

然后再main.ts中进行引用注册

import App from './App.vue'

import {filePreview} from '@/utils/filePreview';

const app = createApp(App)

app.config.globalProperties.$filePreview = filePreview;

使用方法

<el-button

                      size="small"

                      type="primary"

                      @click="$filePreview(scope.row)"

                    >

                      预览

                    </el-button>

vue3封装全局方法

场景：各个模块详情中存在附件列表数据，需要再每个中添加一个预览附件的方法，是后期提出的需求，所以要在每个模块中进行添加，就去将预览方法封装一下。将公共方法封装在utils下 utils/filePreview.ts import router…...

编程日记 2025/5/16 17:01:49

Django 学习指南：从入门到精通（大体流程）

想要快速掌握 Django 开发技能吗？按照以下学习流程，带你从零基础成长为独立开发 Web 应用的高手。一、准备工作：打下坚实基础在开启 Django 之旅前，先确保你已掌握以下 Python 基础知识： 数据类型：熟悉数…...

编程日记 2025/5/1 7:03:04

Java对集合进行操作，赋值新字段

1、方法一：增强for循环 List<Refund> list refundService.selectRefundList(queryParam); for (Refund refund : list) {refund.setPayWay(refund.getPaymentMethod()); // 将支付方式赋值给付款方式 }在 Java 中，当你使用 for 循环遍历 List<…...

编程日记 2025/5/1 7:03:02

【网工第6版】第6章网络安全③

目录 ■ 虚拟专用网VPN ◆虚拟专用网基础 ◆VPN分类 ▲根据应用场景不同分类 ▲根据VPN技术实现的网络层次分类 ◎ 二层隧道协议：L2TP和PPTP ◎ 网络层隧道协议：IPSec和GRE ※ IPSec IPSec基础 IPSec原理 IPSec两种封装模式 ※ GRE ■ 应用…...

编程日记 2025/5/1 7:03:02

20250430在ubuntu14.04.6系统上查看系统实时网速

rootrootubuntu:~$ sudo apt-get install iftop 【不需要root权限】 rootrootubuntu:~$ sudo apt-get install nload rootrootubuntu:~$ sudo apt-get install vnstat 【失败】 rootrootubuntu:~$ sudo apt-get install speedtest-cli rootrootubuntu:~$ sudo apt-get install …...

编程日记 2025/5/1 7:01:59

远程 Debugger 多用户环境下的用户隔离实践

远程 Debugger 多用户环境下的用户隔离实践在现代分布式开发和云原生环境下，远程 Debugger 的应用愈发普遍。然而，随着多人协作和多租户场景的出现，**远程 Debugger 的“用户隔离”**变得至关重要。只有实现了良好的用户隔离，才…...

编程日记 2025/5/1 7:00:54

Neo4j多关系或多路径

目录一、双向关系 1.创建2个节点间的双向关系 2.创建多个路径的节点，双向关系 3.查询带有方向性的关系 4.查询路径上的多个关系 5.查询出a到b的最短距离 6.查询特定长度的路径二、将之前的关系清空下，如图所示，在操作一次 1.查询出…...

编程日记 2025/5/1 7:00:54

Locate 3D：Meta出品自监督学习3D定位方法

标题： Locate 3D: Real-World Object Localization via Self-Supervised Learning in 3D 摘要： 我们提出了 Locate 3D，这是一种可根据指代表达（如“沙发和灯之间的小咖啡桌”）在三维场景中定位物体的模型。Locate 3…...

编程日记 2025/5/1 6:59:52

Copilot for Excel 一键词云分析与情绪分析

在Excel中使用copilot对数据进行高级分析，我们已经领略过copilot的强悍能力： 零代码、超越DeepSeek：Excel高级数据分析，copilot加持、Python助力 Python in Excel高级分析：一键RFM分析然而，很多时候我们…...

编程日记 2025/5/1 6:59:51

【Linux 网络】网络工具ifconfig和iproute/iproute2工具详解

【Linux 网络】网络工具ifconfig和iproute/iproute2工具详解前言1、安装2、常用命令3、命令使用详解前言本篇文章主要介绍Linux下网络工具ifconfig/iproute(iproute2)的安装、使用示例和场景。操作系统Ubuntu 18.04。 1、安装使用apt-get install 命令安装ifconfig和ipr…...

编程日记 2025/5/1 6:59:51

硬盘分区丢失≠末日！3步逻辑恢复法+物理修复全流程图解

引言：硬盘分区丢失——数据安全的“隐形杀手” 在数字化时代，硬盘作为数据存储的核心载体，承载着个人、企业乃至社会的关键信息。然而，硬盘分区丢失这一突发状况，往往让用户措手不及：文件系统突然报错、盘…...

编程日记 2025/5/1 6:59:50

数据接收全流程图（物理网卡 → 应用层）

以下是 DPDK VPP 在 Linux 系统中从网卡收包到应用层的完整数据流程图及分步解析，结合了内核旁路和用户态协议栈的协同工作： 数据接收全流程图（物理网卡 → 应用层） plaintext 复制下载 ----------------------------------…...

编程日记 2025/5/1 6:59:50

【AI】DeepSeek 流程图 / 时序图制作,Word 排版错乱问题,文字转直观图形

一：动态流程图 / 时序图制作（DeepSeek Draw.IO） 工具准备 DeepSeek（AI 生成代码）：官网（免费）Draw.IO（可视化渲染）：官网（免费&#…...

编程日记 2025/5/1 6:59:49

C++继承（上）

目录一、继承的概念及定义 1. 继承的概念 2. 继承的定义 2.1 定义格式 2.2 继承关系和访问限定符 2.3 继承基类成员访问方式的变化二、基类和派生类对象赋值转换三、继承中的作用域四、派生类的默认成员函数一、继承的概念及定义 1. 继承的概念继承是面向对象编…...

编程日记 2025/5/1 6:59:48

分布式-redisson

分布式锁redisson 加锁流程缓存相关问题加锁流程 redisson底层通过lua脚本实现加锁的原子性lock动作包含：加锁、设置超时时间、锁续命未获取到锁的线程通过获取信号量许可等待，所释放后释放信号量通知等待线程缓存相关问题缓存失效（击穿…...

编程日记 2025/5/1 6:58:47

Java学习手册：Spring MVC 架构与实现

一、Spring MVC 概述 Spring MVC 是 Spring 框架的一个模块，它提供了一套 Web 应用开发的解决方案，实现了 MVC（Model-View-Controller）设计模式。Spring MVC 提供了清晰的分离逻辑层、视图层和控制器层的结构，便于开发…...

编程日记 2025/5/1 6:58:46

第四部分：实用应用开发

本部分将涵盖以下关键主题： 视频处理基础视频读取与保存视频帧处理实战：视频中运动目标追踪条形码与二维码识别条形码检测原理（概念）QR 码识别实战：制作二维码扫描器文本识别入门 (OCR) 图像预处理使用 Tesseract…...

编程日记 2025/5/1 6:57:44

目标检测YOLO实战应用案例100讲-基于多级特征融合的小目标深度检测网络

目录知识储备基于多级特征融合的小目标深度检测网络实现一、环境配置二、核心代码实现 1. 多级特征融合模块（models/fpn.py ） 2. 主干网络（models/backbone.py ） 3. 检测头（models/detector.py ）三、完整网络架构（models/net.py ）四、训练代码（train.p…...

编程日记 2025/5/1 6:57:43

单片机-89C51部分：11、IIC 、传感器温湿度

飞书文档https://x509p6c8to.feishu.cn/wiki/Cczpw4oBeiyK71kFhKfcXkQmnad 一、简介 IIC协议，又称I2C协议，是由PHILP公司在80年代开发的两线式串行总线，用于连接微控制器及其外围设备，IIC属于半双工同步通信方式。 C IIC是一种同…...

编程日记 2025/5/1 6:57:43

Java从入门到精通 - Java入门

Java 入门此笔记参考黑马教程，仅学习使用，如有侵权，联系必删文章目录 Java 入门01 Java快速入门1. Java 是什么？能干什么？1.1 Java 背景知识1.2 Java 能做什么？1.3 Java 技术体系 2. 如何使用 Java&…...

编程日记 2025/5/1 6:56:42

SLAM中的状态估计理论：从基础到前沿的完整解析

SLAM中的状态估计理论：从基础到前沿的完整解析一、SLAM状态估计基础与问题建模 1．状态估计问题的数学描述在SLAM（Simultaneous Localization and Mapping，同时定位与地图构建）中，状态估计问题的核心在…...

编程日记 2025/5/1 6:56:41

Android 自带的分享功能分享到三方应用

1. 分享视频到三方应用 var shareIntent Intent(Intent.ACTION_SEND)shareIntent.setType("video/*")shareIntent.putExtra(Intent.EXTRA_STREAM, Uri.parse(path))startActivity(Intent.createChooser(shareIntent, "")) 2. 分享音频到三方应用 var sha…...

编程日记 2025/5/1 6:56:40

宇树科技开启“人形机器人格斗盛宴”

2025年5月至6月，一场备受瞩目的全球性科技盛事——全球首届“人形机器人格斗大赛”将由杭州宇树科技隆重开启。赛事将带来前所未有的机器人格斗视觉冲击，吸引全球目光聚焦。为打造顶级参赛队伍，宇树科技的技术精英团队已连续多周开展密集的算…...

编程日记 2025/5/1 6:56:39

K8S - 命名空间实战 - 从资源隔离到多环境管理

引言在传统的物理机或虚拟机环境中，不同业务应用共享资源，容易导致权限冲突、资源争用和管理混乱。Kubernetes 通过命名空间（Namespace）实现资源逻辑隔离，将集群划分为多个虚拟子集群，从而解决以下问题&…...

编程日记 2025/5/1 6:56:39

【安全扫描器原理】基于协议的服务扫描器

【安全扫描器原理】基于协议的服务扫描器 1.概述2.服务扫描的基本原理3.WWW服务扫描4.FTP服务扫描5.Telnet服务扫描1.概述一台计算机逻辑上可以提供多项服务，每安装一个服务，即打开了一个或多个端口。从这个角度上看，每个服务对应一个或几个指定端口，反之，如果能检测到某…...

编程日记 2025/5/1 6:56:38

第十六届蓝桥杯 2025 C/C++组数列差分

目录题目： 题目描述： 题目链接： 思路： 核心算法： 思路详解： 代码： 代码详解： 题目： 题目描述： 题目链接： P12342 [蓝桥杯 2025 省 B/Py…...

编程日记 2025/5/1 6:55:37

模式识别的基本概念与理论体系

前面在讨论专家系统时曾经说过，为了使计算机具有自动获取知识的能力，除了应使它具有学习能力外，还应使它具有能识别诸如文字、图形、图象、声音等的能力，计算机的这种识别能力是模式识别研究的主要内容。当然，模式识别…...

编程日记 2025/5/1 6:55:37

机器学习，深度学习

定义（非正式）：不进行明确编程的情况下，提供大量数据让计算机进行自我学习分类：监督(supervised)学习，无监督(unsupervised)学习监督学习：提供的数据中包含了问题到正确答案(x到y)的映射&#xf…...

编程日记 2025/5/1 6:55:36

smolagents - Guided tour

https://colab.research.google.com/github/huggingface/notebooks/blob/main/smolagents_doc/en/pytorch/guided_tour.ipynbhttps://colab.research.google.com/github/huggingface/notebooks/blob/main/smolagents_doc/en/pytorch/guided_tour.ipynb...

编程日记 2025/5/1 6:55:34

【keil使用】无法打开keil工程，只有空白界面的解决方法

【keil使用】无法打开keil工程，只有空白界面的解决方法一、最常见的原因在我们新建keil工程或下载其他大佬的keil工程的时候可能会出现工程无法正常打开的情况，如图所示： 其中最常见的一个原因就是keil工程的目录路径太长了，W…...

编程日记 2025/5/1 6:54:33

openEuler 22.03 安装 Nginx，支持离线安装

目录一、环境检查1.1 必要环境检查1.2 在线安装（有网络）1.3 离线安装（无网络） 二、下载Nginx2.1 在线下载2.2 离线下载三、安装Nginx四、开机自启服务五、开放防火墙端口六、常用命令一、环境检查 1.1 必要环境检查 # 查看 g…...

编程日记 2025/5/1 6:54:32

Excel 数组功能及应用示例

Excel表格中的数组（Array）是一个可以同时存储和操作多个数据的结构。数组可以是单行、单列（一维数组）或多行多列（二维数组）。在Excel中，数组公式或动态数组功能可以一次性处理多个值&#xff0c…...

编程日记 2025/5/1 6:54:32

C++后端服务器开发：侵入式与非侵入式程序结构解析

在C后端服务器开发中，架构设计是决定系统性能、可扩展性和可维护性的关键因素之一。尽管不同的业务需求会导致服务器架构的多样化，但网络通信模块作为所有服务的通用部分，为我们提供了一个抽象和讨论的基础。基于此，我们可以将服务…...

编程日记 2025/5/1 6:54:31

「Mac畅玩AIGC与多模态09」开发篇05 - 使用自定义天气查询插件开发智能体应用

一、概述本篇介绍如何在 macOS 环境下，通过编写自定义 OpenAPI Schema，将天气查询服务接入 Dify 平台，并开发基于实时天气信息的智能体应用。本案例培养路径参数与查询参数结合的插件开发技巧，实现智能体和外部实时数据的动态联动。二、环境准备 1. 确认本地开发环境 …...

编程日记 2025/5/1 6:54:31

Maven插件学习（五）—— 将项目构建生成的 OSGi Bundles（或 Features）发布到一个 P2 仓库

发布OSGi Bundles到一个 P2 仓库读取项目中properties文件中的属性 <plugin><groupId>org.codehaus.mojo</groupId><artifactId>properties-maven-plugin</artifactId><version>1.0-alpha-2</version><executions><exec…...

编程日记 2025/5/1 6:54:30

欧拉计划 Project Euler61（循环的多边形数）题解

欧拉计划 Project Euler 61 题解题干思路code 题干思路先生成所有四位数的多边形数集合分类保存，然后dfs找即可 code // 2512 1281 8128 2882 8256 5625 // 28684 #include <bits/stdc.h>using namespace std;using ll long long;typedef vector<i…...

编程日记 2025/5/1 6:54:28

C语言与Unix的传奇起源

C语言与Unix的传奇起源背景：Multics项目的困境这段历史要从20世纪60年代中叶的美国说起。当时，三大技术巨头——麻省理工学院（MIT）、AT&T贝尔实验室和通用电气（GE）——联手为GE-645大型机开发一个名…...

编程日记 2025/5/1 6:53:27

C#扩展方法与Lambda表达式基本用法

C# 扩展方法与 Lambda 表达式详解一、扩展方法详解 1. 基本概念扩展方法允许为现有类型"添加"方法，而无需修改原始类型或创建派生类型。定义条件： 必须在静态类中定义方法本身必须是静态的第一个参数使用this修饰符指…...

编程日记 2025/5/1 6:53:25

C#规避内存泄漏的编码方法

C#规避内存泄漏的编码方法内存泄漏是C#开发中常见的问题，尽管.NET有垃圾回收机制(GC)，但不当的编码实践仍可能导致内存无法被及时回收。以下是系统性的规避内存泄漏的方法： 一、理解内存泄漏的常见原因未释放的事件订阅静态…...

编程日记 2025/5/1 6:53:25

ARM 指令集(ubuntu环境学习) 第一章：ARM 指令集概述

1.1 ARM 架构简介 ARM（Advanced RISC Machine）是一种精简指令集计算机（RISC）架构，最初由英国的 ARM Holdings 公司设计。与复杂指令集计算机（CISC）不同，RISC 架构通过使用简单且高效的指令集，使得处理器能够以更高的速度和更低的功耗执行任务。ARM 架构被广泛应用于各…...

编程日记 2025/5/1 6:53:24

OpenCV实战教程：从零开始的计算机视觉之旅

第一部分：基础入门 OpenCV简介什么是OpenCV及其应用领域开发环境搭建（Windows/MacOS/Linux）安装配置和第一个程序"Hello OpenCV" 图像基础图像的数字表示方式色彩空间（RGB、HSV、灰度图）图像读取、显示与…...

编程日记 2025/5/1 6:53:23

零基础做自动驾驶集成测试（仿真）

图 1：使用 GPUDrive 进行极快的多代理模拟。上图：GPUDrive 中 Waymo Open Motion Dataset 场景的鸟瞰图，方框表示受控智能体，圆圈表示其目标。底部：相应的代理视图，以一个代理为中心。可以根据用户的目标轻…...

编程日记 2025/5/1 6:52:21

‌阿里云dns服务器不可用怎么办?dns可以随便改吗?

阿里云DNS服务器不可用怎么办?dns可以随便改吗? 当DNS服务器不可用时，可能导致无法访问网站或网络服务。以下是常见的解决方法： 1. 检查网络连接确保设备已连接到互联网（如Wi-Fi或有线网络）。尝试访问其他网站或服务&#x…...

编程日记 2025/5/1 6:52:21

神经网络用于地震数据时空均匀插值的方法与开源资料

神经网络用于地震数据时空均匀插值的方法与开源资料地震数据的不均匀采样是一个常见问题，神经网络提供了一种有效的解决方案。以下是关于如何使用神经网络进行地震数据时空均匀插值的概述和可用资源。主要方法 1. 基于深度学习的插值方法卷积神经网络(CNN)&a…...

编程日记 2025/5/1 6:52:20

线性微分方程与非线性微分方程

方程一 d x d t x \frac{dx}{dt} x dtdxx 这是一个一阶线性常微分方程，可以直接分离变量求解。将变量分离： d x x d t \frac{dx}{x} dt xdxdt 两边积分： ∫ 1 x d x ∫ 1 d t ⇒ ln ⁡ ∣ x ∣ t C \int \frac{1}{x} \, dx \…...

编程日记 2025/5/1 6:52:18

Windows查看和修改IP，IP互相ping通

Windows系统查看IP地址 winr 输入cmd 打开终端使用 ipconfig 或 ipconfig -all 命令查看当前网络 IPV4地址 Windows系统修改IP地址自动获取IP（DHCP）： 打开控制面板，点击网络和Internet。点击网络和共享中心。选择更改适配…...

编程日记 2025/5/1 6:51:16

ESP32开发之freeRTOS的信号量

什么是信号量信号量能干啥信号量的函数实例举例总结什么是信号量简而言之，就是发出通知，接收通知的任务获得通知后去干啥啥。通知有多有少。自定义通知数量的，叫计数型信号量；只有有无（即“0”，“1”）通知的，叫二进制信号量。信号量能干啥资源管理：控制多个任务对…...

编程日记 2025/5/1 6:51:15

CRMEB-PRO系统定时任务扩展开发指南

适用场景当系统内置定时任务类型无法满足业务需求时，开发者可通过本教程快速掌握自定义定时任务的扩展方法。本指南以"定时检测服务"为例，演示完整开发流程。我想添加一个定时任务 ,而这里没有我需要的,我怎么来添加比如我想添加一个定时检…...

编程日记 2025/5/1 6:51:14

单片机不同通信方式的适用场景

一、串口通信 UART 通信双方约定好波特率，每次发送一个字节(8位数据) 这种通信方式一共有2根线，且互相独立不受影响。串口通信的缺点二、RS232和RS485 优点是能够远距离传输信号 RS232达到30m RS485达到1000m 同时RS485还具有一对多的功能三、S…...

编程日记 2025/5/1 6:51:13

【神经网络与深度学习】探索全连接网络如何学习数据的复杂模式，提取高层次特征

引言全连接网络（Fully Connected Network，FCN）是深度学习中的重要架构，广泛用于模式识别、分类和回归任务。其强大的特征提取能力使其能够自动学习输入数据中的复杂模式，并逐步形成高层次特征。这种能力主要依赖于参…...

编程日记 2025/5/1 6:51:13

相关文章：