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

关于使用vue-cropperjs上传一张图后，再次上传时，裁剪的图片不更新的问题

news 2026/2/11 2:00:57
不更新的原因

它与cropperjs不太一样，vue-cropperjs不是一个实例，当页面首次刷新时它就已经创建，即使后面更改了它的某些数据也不会改变，因为浏览器会对dom组件进行缓存。

解决办法

可以使用v-if来控制它的显示和隐藏，这样每次使用时就会重新创建dom，所以通常搭配弹框使用。只要是可以让它重新创建都可以解决这一问题。

                <VueCropper ref="cropper" :img="previewImage" :src="previewImage" preview=".preview" v-if="showCropper":aspect-ratio="aspectRatio" :view-mode="1" :drag-mode="'move'" class="height100" />
实际操作

关于vue-cropperjs的实际操作可以看我主页的另一篇文章

vue3、element plus 及 vue-cropperjs实现自定义图片尺寸、数量等的公共子组件

相关文章：

关于使用vue-cropperjs上传一张图后，再次上传时，裁剪的图片不更新的问题

不更新的原因 它与cropperjs不太一样&#xff0c;vue-cropperjs不是一个实例&#xff0c;当页面首次刷新时它就已经创建&#xff0c;即使后面更改了它的某些数据也不会改变&#xff0c;因为浏览器会对dom组件进行缓存。 解决办法 可以使用v-if来控制它的显示和隐藏&#xff…...

编程日记 2025/1/6 21:13:49

学习threejs，导入VTK格式的模型

&#x1f468;‍⚕️ 主页&#xff1a; gis分享者 &#x1f468;‍⚕️ 感谢各位大佬 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! &#x1f468;‍⚕️ 收录于专栏&#xff1a;threejs gis工程师 文章目录 一、&#x1f340;前言1.1 ☘️THREE.VTKLoader VTK模型加…...

编程日记 2025/1/6 21:07:42

大麦抢票科技狠活

仅供学习参考&#xff0c;切勿再令您所爱的人耗费高昂的价格去购置黄牛票 ⚠️核心内容参考: 据悉&#xff0c;于购票环节&#xff0c;大麦凭借恶意流量清洗技术&#xff0c;于网络层实时甄别并阻拦凭借自动化手段发起下单请求的流量&#xff0c;强化对刷票脚本、刷票软件以及…...

编程日记 2025/1/6 21:03:36

PostgreSQL 表达式

PostgreSQL中的表达式是一种强大的工具&#xff0c;用于在数据库查询中处理和计算数据。它们由一个或多个值、运算符和PostgreSQL函数组合而成&#xff0c;类似于公式&#xff0c;并用于求值【1†source】。 在PostgreSQL中&#xff0c;表达式可以分为不同类型&#xff0c;如布…...

编程日记 2025/1/6 21:01:34

WPF区域导航+导航参数使用+路由守卫+导航日志

背景&#xff1a;使用ContentControl控件实现区域导航是有Mvvm框架的WPF都能使用的&#xff0c;不限于Prism 主要是将ContenControl控件的Content内容在ViewModel中切换成不同的用户控件 下面是MainViewModel&#xff1a; private object body;public object Body {get { retu…...

编程日记 2025/1/6 20:59:30

Springboot启动报错：Failed to start bean ‘documentationPluginsBootstrapper‘

在使用SpringBoot2.7时&#xff0c;由于与Swagger2的版本不兼容引发的ApplicationContextException&#xff0c;解决方法是在application.yml中配置spring.mvc.pathmatch.matching-strategy:ant_path_matcher。 org.springframework.context.ApplicationContextException: Fai…...

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

qt-C++笔记之动画框架(Qt Animation Framework)入门

qt-C笔记之动画框架(Qt Animation Framework)入门 code review! 在 Linux 平台上&#xff0c;使用 C 和 Qt 框架实现动画是一个非常好的选择。Qt 提供了强大的动画框架&#xff08;Qt Animation Framework&#xff09;&#xff0c;使得动画的实现变得简单高效。下面将介绍 Qt …...

编程日记 2025/1/6 20:51:22

C++26 函数契约(Contract)概览

文章目录 1. 什么是契约编程?契约编程的三大核心: 2. C26 契约编程的语法语法示例 3. 契约检查模式3.1. default 模式3.2. audit 模式3.3. axiom 模式检查模式的设置 4. 契约编程与传统 assert 的区别示例对比 5. 契约编程的应用场景6. 注意事项7. 示例: 带契约的矩形面积计算…...

编程日记 2025/1/6 20:49:21

Flink CDC 自定义函数处理 SQLServer XML类型数据 映射 doris json字段方案

Flink CDC 自定义函数处理 SQLServer XML类型数据方案 1. 背景 因业务使用SQLServer数据库&#xff0c;CDC同步到doris 数仓。对于SQLServer xml类型&#xff0c;doris没有相应的字段对应&#xff0c; 可以使用json来存储xml数据。需要进行一步转换。从 flink 自定义函数入手…...

编程日记 2025/1/6 20:46:18

F.interpolate函数

F.interpolate 是 PyTorch 中用于对张量&#xff08;通常是图像数据&#xff09;进行插值操作的函数&#xff0c;常用于调整张量的大小&#xff0c;例如改变图像的分辨率。它支持多种插值方法&#xff0c;包括最近邻插值、双线性插值和三次插值等。 语法 torch.nn.functional…...

编程日记 2025/1/6 20:45:17

华为交换机---自动备份配置到指定ftp/sftp服务器

华为交换机—自动备份配置到指定ftp服务器 需求 交换机配置修改后及时备份相关配置，每次配置变化后需要在1分钟后自动进行保存，并且将配置上传至FTP服务器；每隔30分钟，交换机自动把配置上传到FTP服务器。 1、定时保存新配置的时间间隔为*分钟（1天=1440），默认为30分钟（…...

编程日记 2025/1/6 20:44:16

nginx学习之路-nginx配置https服务器

文章目录 1. 生成证书2. 配置证书1. 拷贝证书文件2. 修改conf/nginx.conf文件内容 3. 查看效果1. 重载配置2. 访问 1. 生成证书 在linux系统下执行&#xff0c;使用openssl命令。&#xff08;windows环境也可以使用cmder&#xff09; # 1. 生成私钥 server2025.key(无密码保护…...

编程日记 2025/1/6 20:41:12

UCAS 24秋网络认证技术 CH10 SSL 复习

TLS字段、参数含义要了解每个消息是什么意思 基本方式只验证服务端&#xff0c;服务端有证书&#xff0c;变形方式加上验证客户端TLS1.3区别 协商过程 背景 Record层使用的各种加密算法参数&#xff0c;均由Handshake协议协商获得。 具体过程 随机数交换 Client/Server相互…...

编程日记 2025/1/6 20:39:01

【linux内核分析-存储】EXT4源码分析之“文件删除”原理【七万字超长合并版】（源码+关键细节分析）

EXT4源码分析之“文件删除”原理【七万字超长合并版】&#xff08;源码关键细节分析&#xff09;&#xff0c;详细的跟踪了ext4文件删除的核心调用链&#xff0c;分析关键函数的细节&#xff0c;解答了开篇中提出的三个核心疑问。 文章目录 提示前言全文重点索引1.源码解析1.1 …...

编程日记 2025/1/6 20:35:55

代码随想录 day62 第十一章 图论part11

第十一章&#xff1a;图论part11 Floyd 算法精讲 Floyd 算法代码很简单&#xff0c;但真正理解起原理 还是需要花点功夫&#xff0c;大家在看代码的时候&#xff0c;会发现 Floyd 的代码很简单&#xff0c;甚至看一眼就背下来了&#xff0c;但我为了讲清楚原理&#xff0c;本…...

编程日记 2025/1/6 20:33:53

springboot571基于协同过滤算法的私人诊所管理系统(论文+源码)_kaic

摘 要 随着时代的发展&#xff0c;人们的生活方式得到巨大的改变&#xff0c;从而慢慢地出现了大量私人诊所信息&#xff0c;私人诊所信息管理需要一个现代化的管理系统&#xff0c;进行私人诊所的管理。 私人诊所管理系统的开发就是为了解决私人诊所信息管理的问题&#xff0…...

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

Uniapp Android 本地离线打包（详细流程）

一、简介 App 离线 SDK 暂时不支持 Kotlin&#xff0c;未来不清楚。 uniapp 提供了 云打包 与 本地打包 两种方案&#xff0c;云打包 需要排队且还有次数限制&#xff0c;本地打包 则就没有这些限制&#xff0c;而且会 本地打包 对开发 原生插件 有很大的帮助。 细节&#x…...

编程日记 2025/1/6 20:31:51

vite+vue3动态引入资源文件（问题已解决但离了个大谱）

教程很详细&#xff0c;直接上代码 解决方法&#xff08;赶时间的小友理解下这函数就能解决问题了&#xff0c;就是处理了下路径&#xff0c;运气不好遇到问题再回来也不迟&#x1f923;&#x1f923;&#x1f923;&#xff09; const getSvgUrl (name) > {// name: svg_1…...

编程日记 2025/1/6 20:29:49

通过 4 种方式快速将音乐从 iPod 传输到 Android

概括 在 iPod 上听音乐很酷&#xff0c;但是当您拥有最新的 Android 手机时&#xff0c;也许您想在新手机上欣赏 iPod 音乐。那么&#xff0c;你的计划是什么&#xff1f;如何将音乐从 iPod 传输到 Android&#xff1f; 如果您担心这个问题&#xff0c;请看看下面的方法。他们…...

编程日记 2025/1/6 20:28:46

ArcGIS中怎么把数据提取到指定范围(裁剪、掩膜提取)

最近&#xff0c;经常能收到怎么把数据提取到指定范围、栅格数据怎么裁剪、矢量数据怎么裁剪、栅格数据怎么掩膜提取的咨询。 下面是我对这个问题的解决思路&#xff1a; 对于矢量数据&#xff1a; ①首先把数据加载进来 ②软件界面上面的工具栏找到→地理处理→裁剪&#x…...

编程日记 2025/1/6 20:24:42

MPNet：旋转机械轻量化故障诊断模型详解python代码复现

目录 一、问题背景与挑战 二、MPNet核心架构 2.1 多分支特征融合模块（MBFM） 2.2 残差注意力金字塔模块（RAPM） 2.2.1 空间金字塔注意力（SPA） 2.2.2 金字塔残差块（PRBlock） 2.3 分类器设计 三、关键技术突破 3.1 多尺度特征融合 3.2 轻量化设计策略 3.3 抗噪声…...

编程新知 2026/2/10 22:48:02

Nuxt.js 中的路由配置详解

Nuxt.js 通过其内置的路由系统简化了应用的路由配置&#xff0c;使得开发者可以轻松地管理页面导航和 URL 结构。路由配置主要涉及页面组件的组织、动态路由的设置以及路由元信息的配置。 自动路由生成 Nuxt.js 会根据 pages 目录下的文件结构自动生成路由配置。每个文件都会对…...

编程新知 2026/2/9 4:13:22

【Zephyr 系列 10】实战项目：打造一个蓝牙传感器终端 + 网关系统（完整架构与全栈实现）

🧠关键词：Zephyr、BLE、终端、网关、广播、连接、传感器、数据采集、低功耗、系统集成 📌目标读者：希望基于 Zephyr 构建 BLE 系统架构、实现终端与网关协作、具备产品交付能力的开发者 📊篇幅字数：约 5200 字 ✨ 项目总览 在物联网实际项目中，**“终端 + 网关”**是…...

编程新知 2026/1/31 6:12:22

大语言模型（LLM）中的KV缓存压缩与动态稀疏注意力机制设计

随着大语言模型&#xff08;LLM&#xff09;参数规模的增长&#xff0c;推理阶段的内存占用和计算复杂度成为核心挑战。传统注意力机制的计算复杂度随序列长度呈二次方增长&#xff0c;而KV缓存的内存消耗可能高达数十GB&#xff08;例如Llama2-7B处理100K token时需50GB内存&a…...

编程新知 2026/1/28 1:40:03

AI+无人机如何守护濒危物种？YOLOv8实现95%精准识别

【导读】 野生动物监测在理解和保护生态系统中发挥着至关重要的作用。然而&#xff0c;传统的野生动物观察方法往往耗时耗力、成本高昂且范围有限。无人机的出现为野生动物监测提供了有前景的替代方案&#xff0c;能够实现大范围覆盖并远程采集数据。尽管具备这些优势&#xf…...

编程新知 2026/1/26 12:50:00

Python Einops库：深度学习中的张量操作革命

Einops&#xff08;爱因斯坦操作库&#xff09;就像给张量操作戴上了一副"语义眼镜"——让你用人类能理解的方式告诉计算机如何操作多维数组。这个基于爱因斯坦求和约定的库&#xff0c;用类似自然语言的表达式替代了晦涩的API调用&#xff0c;彻底改变了深度学习工程…...

编程新知 2025/10/16 12:04:52

Unity UGUI Button事件流程

场景结构 测试代码 public class TestBtn : MonoBehaviour {void Start(){var btn GetComponent<Button>();btn.onClick.AddListener(OnClick);}private void OnClick(){Debug.Log("666");}}当添加事件时 // 实例化一个ButtonClickedEvent的事件 [Formerl…...

编程新知 2026/2/9 18:50:34

云原生周刊：k0s 成为 CNCF 沙箱项目

开源项目推荐 HAMi HAMi&#xff08;原名 k8s‑vGPU‑scheduler&#xff09;是一款 CNCF Sandbox 级别的开源 K8s 中间件&#xff0c;通过虚拟化 GPU/NPU 等异构设备并支持内存、计算核心时间片隔离及共享调度&#xff0c;为容器提供统一接口&#xff0c;实现细粒度资源配额…...

编程新知 2025/12/1 3:15:17

解析“道作为序位生成器”的核心原理

解析“道作为序位生成器”的核心原理 以下完整展开道函数的零点调控机制&#xff0c;重点解析"道作为序位生成器"的核心原理与实现框架&#xff1a; 一、道函数的零点调控机制 1. 道作为序位生成器 道在认知坐标系$(x_{\text{物}}, y_{\text{意}}, z_{\text{文}}…...

编程新知 2026/2/9 11:41:07

命令行关闭Windows防火墙

命令行关闭Windows防火墙 引言一、防火墙：被低估的"智能安检员"二、优先尝试！90%问题无需关闭防火墙方案1：程序白名单（解决软件误拦截）方案2：开放特定端口（解决网游/开发端口不通）三、命令行极速关闭方案方法一：PowerShell（推荐Win10/11）​方法二：CMD命令…...

编程新知 2025/8/27 20:07:03