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

react中封装一个预览.doc和.docx文件的组件

主要用到了mammoth这个插件,mammoth.js‌是一个JavaScript库,主要用于将Microsoft Word文档(.docx格式)转换为HTML。它可以通过Node.js环境使用,也可以直接在浏览器中使用。

关键代码:

import mammoth from 'mammoth';
import { useEffect, useState, useRef } from 'react';
import { Slider, Spin, Space } from 'antd';
import './index.global.less';
import { type } from 'os';
import { parse } from 'path';interface Props {filePath: string;type: string;screenFlag: string;isReadingMode: boolean;
}
// react中封装一个预览.doc和.docx文件的组件
const DocView: (props: Props) => JSX.Element = (props: Props) => {const [docDom, setDocDom] = useState(<Space size="large" className="icon-loading"><Spin size="large" /></Space>);const [textDom, setTextDom] = useState('');const [scale, setScale] = useState(180);const [warpClassName, setWarpclassName] = useState(['view-warper']);const textInput = useRef(null);const { filePath, type, screenFlag, isReadingMode } = props;const mOptions = {includeDefaultStyleMap: true,convertImage: mammoth.images.imgElement(function (image) {return image.read('base64').then(function (imageBuffer) {if (image.contentType === 'image/x-wmf') {return {}}return {src: 'data' + image.contentType + ';base64,' + imageBuffer,}});}),};useEffect(() => {return () => {setDocDom('');<Space size="large" className="icon-loading"><Spin size="large" /></Space>}}, []);// 引入全局样式类名(具体样式我就不展示了)useEffect(() => {const name = ['view-warper'];if (type === 'doc' || type === 'docx') {name.push('docx-warp');} else {name.push('text-warp');}if (screenFlag) {name.push('big-screen');}else {name.push('small-screen');}if (isReadingMode) {name.push('reading-mode');}else {name.push('normal-mode');}setWarpclassName(name);if (!screenFlag) {setScale(100);}}, [screenFlag, type, isReadingMode]);useEffect(() => {if (type === 'txt' && !textDom) {return false;}if (scale / 100 < 1) {textInput.current.style.transformOrigin = 'top center';} else {textInput.current.style.transformOrigin = 'left top';}}, [scale]);const handleScale = value => {setScale(value);};useEffect(() => {setDocDom(<Space size="large" className="icon-loading"><Spin size="large" /></Space>);if (!filePath) {return}if (type === 'txt') {// 以自己项目实际接口为准api.getDocumentDetailAfter(filePath).then((res: any) => {if (res) {setTextDom(res);}else {setTextDom('该文档没有任何内容');}textInput.current.style.transformOrigin = 'left top';}).catch((error: any) => {throw new Error(error);})}if (type === 'doc' || type === 'docx') {const jsonFile = new XMLHttpRequest();jsonFile.open('POST', '/xxx/xxx', true);jsonFile.setRequestHeader('Content-Type', 'application/json');jsonFile.send(filePath);jsonFile.responseType = 'arraybuffer';jsonFile.onreadystatechange = () => {if (jsonFile.readyState === 4 && jsonFile.status === 200) {mammoth.convertToHtml({ arrayBuffer: jsonFile.response },mOptions).then((result: any) => {setDocDom(parse(result.value));textInput.current.style.transformOrigin = 'left top';}).catch(a => {throw new Error(a);setDocDom(<div className="res-error"><p>无法查看此文档</p><p>请检查重新上传docx文件</p></div>);})} else if (jsonFile.status !== 200) {setDocDom(<div className="res-error"><p>网络超时,请稍后再试</p></div>);}}}}, [filePath]);return (<div className={warpClassName.join(' ')}>{(type === 'doc' || type === 'docx')&& <divid="docx"style={{ transform: `scale(${scale / 100})` }}className='docx-content'ref={textInput}>{docDom}</div>}{(type === 'txt')&& (textDom ? <textareaid="txt"className="txt-content"style={{ transform: `scale(${scale / 100})` }}ref={textInput}value={textDom}></textarea> : docDom)}{(type !== 'txt' && screenFlag)&& <div className="docx-footer"><div className="slider-warp"><aclassName="slider-icon more-icon"onClick={() => setScale(setScale(~~scale + 5))}/><SliderclassName="slider"min={0}max={100}defaultValue={100}onChange={handleScale}value={scale}tooltipVisible={false}/><a className="slider-icon less-icon" onClick={() => setScale(setScale(~~scale - 5))}></a></div></div>}</div>)}

index.global.less代码如下:

.view-warper {.icon-loading {align-items: center;justify-content: center;width: 100%;height: 100%;}.docx-warp {height: calc(100% - 40px);width: 100%;overflow: auto;}.res-error {padding: 108px 32px;height: 250px;transform: translate(0, 100%);position: relative;text-align-last: center;background: url(./error.png) top center no-repeat; // 注意项目图片路径p {text-indent: 0;margin-bottom: 0;}}#docx {height: 100%;padding: 10px;flex: 1;.res-error {padding: 108px 32px;height: 250px;transform: translate(0, 100%);position: relative;text-align-last: center;background: url(./error.png) top center no-repeat; // 注意项目图片路径p {text-indent: 0;margin-bottom: 0;}}img {max-width: 80%;display: flex;margin: 0 auto;}html {overflow-y: scroll;font-family: helvetica, arial, sans-serif;}body {margin: 0;padding: 0;}h3+p {margin-left: 40px;}h3+p+ul,h3+ol {margin-left: 40px;}h2+ul {margin-left: 60px;}h3+ol {margin-left: 60px;}.container {overflow: auto;max-width: 940px;margin: 0 auto;}.banner {overflow: auto;margin-bottom: 20px;background-color: #555;color: #fff;}.banner a {color: #fff;}.banner h1 {font-size: 20px;line-height: 2;margin: .5em 0;}.span8,.span4 {float: left;}.span8 {width: 620px;}.span4 {margin: 0 0 0 20px;}.well {background-color: #f2f2f2;border: 1px solid #ccc;padding: 1em;min-height: 200px;}.messages .warning {color: #c60;}li {list-style: decimal;margin-bottom: 10px;}p {margin-bottom: 10px;line-height: 25;text-indent: 60px;}p+ol {margin-left: 50px;}h1 {text-align: center;font-weight: bolder;font-size: 26px;margin: 20px 0;}::marker {color: blue;font-size: 1.2em;display: none;content: '';}ul {list-style: none;}strong {font-size: 24px;}h2 {padding-left: 30px;}table {border-collapse: collapse;margin: 24px auto;font-size: 0.9em;font-family: sans-serif;box-shadow: 0 0 20px rgba(0, 0, 0, .15);table-layout: fixed;width: 90%;strong {font-size: 12px;}}table td p {border-bottom: none;}table thead tr {background-color: #1ab394;color: #fff;text-align: left;}table li,table p {margin-bottom: 10px;margin-left: 0;border-bottom: 1px solid #e7e7e7;padding-bottom: 10px;padding-top: 15px;}table th,.styled-table td {padding: 12px 15px;}table tbody tr {border-bottom: 1px solid #ddd;}table tbody tr:last-of-type {border-bottom: 2px solid #1ab394;}table tbody tr.active-row {font-weight: bolder;color: #1ab394;}}.docx-footer {height: 40px;border-top: 1px solid gray;position: fixed;width: inherit;right: 424px;background: #fff;bottom: 0;.slider-warp {display: flex;align-items: center;margin-right: 25px;height: 40px;flex-direction: row-reverse;.slider {width: 80px;}.slider-icon {display: inline-block;width: 18px;height: 18px;background-position: top center;background-size: 100%;cursor: pointer;}.more-icon {background-image: url('./more.png');}.less-icon {background-image: url('./less.png');}}}.ant-slider-handle,.ant-slider-handle.ant-tooltip-open {border: 1px solid #2468f2;}.ant-slider-track {background-color: #2468f2;border-radius: 5px;z-index: 111;}.ant-slider-handle {z-index: 112;}.ant-slider-step {background-color: #91d5ff;z-index: 1;border-radius: 5px;}
}.text-warp {height: calc(100% - 60px);margin: 12px auto;text-align: center;.txt-content {padding: 10px;}textarea {width: 90%;height: 100%;border: none;resize: none;outline: none !important;overflow: auto;&:focus {border: none;outline: none !important;}}
}.docx-warp {height: calc(~'100% - 45px');background: #fff;margin: 12px auto 13px;overflow: auto;width: 93%;#docx {&>p:nth-child(2)>strong {font-size: 18px;}&>p:nth-child(3) {margin-top: 100px;text-align: center;}&>p:nth-child(4) {margin-bottom: 100px;text-align: center;}&>p:nth-child(5) {margin-bottom: 100px;text-align: center;}&>p>a {color: #333;text-align: center;}&>ul {li {margin-left: 0;}}&>h3 {margin: 20px 60px 20px;}}
}.normal-mode {width: 93%;.docx-footer {width: inherit;right: 424px;}
}.reading-mode {width: 98%;.docx-footer {left: 0;right: 0;width: 100%;}
}

基本上实现了查看word文档内容要求的展示内容,图片+文字说明的形式,代码可鞥有些冗余,还有需要优化的地方.

相关文章:

react中封装一个预览.doc和.docx文件的组件

主要用到了mammoth这个插件,mammoth.js‌是一个JavaScript库&#xff0c;主要用于将Microsoft Word文档&#xff08;.docx格式&#xff09;转换为HTML。它可以通过Node.js环境使用&#xff0c;也可以直接在浏览器中使用。 关键代码: import mammoth from mammoth; import { u…...

驾驭音质,尽享四通道力量——AXPA17851

AXPA17851: 4x48W 车用AB类四通道桥式输出音频功率放大器 AXPA17851是采用BCD(双极型&#xff0c;CMOS&#xff0c;DMOS)工艺技术设计的四通道桥式输出AB类车用音频功率放大器&#xff0c;采用完全互补的P型/ N型输出结构&#xff0c; 具有轨到轨的输出电压摆幅&#xff0c;高输…...

人格伤疤测试:发现内心深处的情感创伤

人格伤疤测试&#xff1a;发现内心深处的情感创伤 工具介绍 我们开发了一个专业的人格伤疤测试工具&#xff0c;帮助您发现和了解内心深处的情感创伤。这个在线测评从十个关键维度全面评估您的心理状态&#xff1a; 核心维度 情感创伤: 评估童年经历对当前情绪的影响自我认…...

CANopen协议简单介绍和使用

文章目录 一、CAN总线介绍二、CAN总线的帧类型三、CAN总线的特性四、Linux中的CAN帧驱动结构体五、CAN总线升级版本-CANFD六、更高层封装的协议-应用层封装的CANopen协议总结 一、CAN总线介绍 CAN总线&#xff08;Controller Area Network&#xff09; 是一种串行通信协议&…...

数据隐私在Web3环境下的重要性及实现方法

在这个信息爆炸的时代&#xff0c;我们正站在 Web3 的门槛上&#xff0c;迎接着一个全新的网络架构和用户交互方式。Web3 不仅仅是技术的迭代&#xff0c;它还代表了一种全新的网络架构和用户交互方式。在 Web3 环境下&#xff0c;数据隐私成为了一个至关重要的话题。本文将探讨…...

【每日八股】复习 Redis Day4:线程模型

文章目录 复习 Redis Day4&#xff1a;线程模型介绍一下 Redis 的线程模型核心线程模型&#xff08;Redis 6.0 之前&#xff09;Redis 6.0 的多线程改进Redis 真的是单线程吗&#xff1f;Redis 的线程模型剖析 上一篇 Redis 的应用我今天才完成&#xff0c;因此明天一并复习 Re…...

手动创建一份konga对应helm的chart项目

rootiZj6c72dzbei17o2cuksmeZ:~/yaml/konga# helm create konga-chart Creating konga-chart更改对应的文件 deployment.yaml rootiZj6c72dzbei17o2cuksmeZ:~/yaml/konga/konga-chart# cat templates/deployment.yaml apiVersion: apps/v1 kind: Deployment metadata:name: k…...

GD32F407单片机开发入门(十九)DMA详解及ADC-DMA方式采集含源码

文章目录 一.概要二.GD32F407VET6单片机DMA外设特点三.GD32单片机DMA内部结构图四.DMA各通道请求五.GD32F407VET6单片机ADC-DMA采集例程六.工程源代码下载七.小结 一.概要 基本概念&#xff1a; DMA是Direct Memory Access的首字母缩写,是一种完全由硬件执行数据交换的工作方式…...

AI HR新范式:易路iBuilder如何通过“技术隐身,价值凸显”,成为HR身份转型的好帮手

HR的身份危机与转型机遇 面对本轮AI引发的组织重构浪潮&#xff0c;HR在组织中的角色发生了哪些变化&#xff1f; 传统&#xff0c;HR负责构建公司“人员流程”的体系与专业服务&#xff0c;涵盖招聘、发展、薪酬、支持等职能。但在企业持续追求“生产力”的当下&#xff0c;…...

栈与队列 Part 7

队列的链式存储结构及实现 队列的链式存储结构&#xff0c;其实就是线性表的单链表&#xff0c;只不过它只能尾进头出而已&#xff0c;我们把它简称为链队列 为了操作上的方便&#xff0c;我们将队头指针指向链队列的头结点&#xff0c;而队尾指针指向终端结点&#xff0c;如图…...

pinia实现数据持久化插件pinia-plugin-persist-uni

在学习uniapp过程中&#xff0c;看到了pinia-plugin-persist-uni插件&#xff0c;以前面试过程中也有面试过说vuex数据刷新之前的数据就丢失了&#xff0c;之前回答的是把数据存储到数据库或者本地存储。pinia-plugin-persist-uni本质上数据也是本地存储。 1、安装 npm instal…...

32单片机——独立看门狗

1、IWDG的简介 IWDG&#xff1a;Independent watchdog&#xff0c;即独立看门狗 独立看门狗本质上是一个定时器&#xff0c;该定时器是一个12位的递减计数器&#xff0c;当计数器的值减到0的时候&#xff0c;就会产生一个复位信号 如果在计数没减到0之前&#xff0c;重置计数器…...

人工智能数学基础(五):概率论

概率论是人工智能中处理不确定性的核心工具&#xff0c;它为机器学习、数据科学和统计分析提供了理论基础。本文将深入浅出地介绍概率论的重要概念&#xff0c;并结合 Python 实例&#xff0c;帮助读者更好地理解和应用这些知识。资源绑定附上完整资源供读者参考学习&#xff0…...

Hbuilder 开发鸿蒙应用,打包成 hap 格式(并没有上架应用商店,只安装调试用)

效果 这个是打包后的 hap 文件&#xff0c;&#xff08;并没有上架应用商店&#xff0c;只安装调试用&#xff09; 拖到模拟器里&#xff0c;可以正常安装 这是鸿蒙的版本 前置 注册华为开发者账号 下载 DevEco-studio 软件 hbuilder 阿尔法版本 大致思路 然后注册…...

第一章 OpenCV篇-配置及基础知识-Python

目录 一.Python配置OpenCV 二.图像基本操作 1.数据读取-图像 2.数据读取-视频 三.ROI区域 1.任意提取区域 2.边界填充 四.数值计算 1.图像相加 2.图像融合 此章节主要讲解计算机视觉也就是OpenCV&#xff0c;这是我即将开启的篇章&#xff0c;其中这一章主要运用的语…...

NPTL原理分析

1. NPTL 简介 1.1. 定义与核心目的 原生 POSIX 线程库 (Native POSIX Thread Library, NPTL) 是 GNU C 库 (glibc) 中针对 Linux 操作系统的 POSIX Threads (pthreads) 标准规范的现代实现。其根本作用在于为 Linux 系统提供高效且符合标准的并发多线程编程能力。NPTL 并非一…...

先知AIGC超级工场,如何助力企业降本增效?

北京先智先行科技有限公司&#xff0c;作为行业内备受瞩目的企业&#xff0c;销售有“先知大模型”、“先行AI商学院”“先知AIGC超级工场”三个旗舰产品。其中&#xff0c;先知大模型私有化部署、先知AIGC超级工场、AI训练师、先知人力资源服务、先知产业联盟&#xff0c;构成…...

【数学建模国奖速成系列】优秀论文绘图复现代码(三)

文章目录 引言箱线图面积图面积图2热图矩阵散点图完整复现代码 引言 数模比赛的绘图是非常重要得&#xff0c;这篇文章给大家分享我自己复现国奖优秀论文的代码&#xff0c;基于Matalab来实现&#xff0c;可以直接运行出图。之前的文章也有分享【折线图】【柱状图】的绘制&…...

架构进阶:72页集管IT基础设施蓝图设计方案【附全文阅读】

该方案适用于集团企业的 IT 决策者、架构师、运维管理人员等。方案指出,企业在发展和市场机遇下面临信息化挑战,需加强统一建设。 其核心是打造以云平台为核心的统一敏捷应用平台。通过分析现状,明确能力需求,提出建设统一、安全、高效的 IaaS 和 PaaS 相结合的技术资源云目…...

从技术角度看Facebook的隐私保护机制

在数字化时代&#xff0c;隐私保护成为了公众关注的焦点。作为全球最大的社交网络平台之一&#xff0c;Facebook 在隐私保护方面采取了一系列技术措施。本文将从技术角度探讨 Facebook 的隐私保护机制&#xff0c;揭示它是如何在提供个性化服务的同时&#xff0c;确保用户隐私信…...

网络安全之浅析Java反序列化题目

前言 这段时间做了几道Java反序列化题目&#xff0c;发现很多题目都是类似的&#xff0c;并且可以通过一些非预期gadget打进去&#xff0c;就打算总结一下常见的题目类型以及各种解法&#xff0c;并提炼出一般性的思维方法。 正文 分析入口点 拿到题目&#xff0c;有附件最…...

make报错:Cannot open jobserver /tmp/GMfifo12676r: No such file or directory

报错描述 执行的命令 make -j16 报错显示&#xff1a;Cannot open jobserver /tmp/GMfifo12676r: No such file or directory 解决办法 make -j16 --jobserver-stylepipe 参考的 Re: Cannot open jobserver ... ## 祝你好运hope("大神多多指点") topic("有…...

企业的呼入语音智能体是什么样子?

当传统客服模式陷入瓶颈&#xff0c;一场沟通革命正在悄然发生——云蝠智能呼入语音智能体&#xff0c;正以AI技术为核心驱动力&#xff0c;为企业重塑服务生态。 深夜11点&#xff0c;客户突然来电咨询订单进度&#xff1b;节假日高峰&#xff0c;客服热线被挤爆却无人应答&am…...

Arduino程序结构详解与嵌入式开发对比指南

Arduino编程详解&#xff1a;从基础到进阶实践 一、Arduino程序的核心架构与扩展设计 1.1 程序框架的深度解析 Arduino程序的基石setup()和loop()函数构成了整个开发体系的核心逻辑。这两个函数的设计哲学体现了嵌入式系统开发的两个关键维度&#xff1a; 初始化阶段&#…...

华为云汪维敏:AI赋能应用现代化,加速金融生产力跃升

4月24日&#xff0c;在2025第四届中国国际软件发展大会的“应用现代化赋能数智金融新时代”论坛上&#xff0c;华为云PaaS服务产品部副部长、应用现代化产业联盟特邀顾问汪维敏先生发表“AI赋能应用现代化&#xff0c;加速金融生产力跃升”主题演讲&#xff0c;介绍了未来应用智…...

linux find命令妙用

对于需要查找一定时间的文件&#xff0c;可以使用find 命令处理 格式参考 find /path/to/search -type f -name "pattern" -mtime -2 -exec sh /path/to/XXX.sh {} /;更多细节讲解看这里find命令时间细讲 那么实际工作中使用的案例 核心命令 find /var/path/ -ty…...

利用v0与Cursor优化开发流程和效率

以下是 v0.dev 与 Cursor 的深度对比分析&#xff0c;基于最新功能&#xff08;截至2025年4月&#xff09;和实际开发场景&#xff1a; 一、核心定位对比 维度v0.devCursor本质定位AI驱动的前端设计工具AI增强的代码编辑器核心目标快速生成可交互的UI原型提升全栈开发效率&am…...

ReSearch: Learning to Reason with Search for LLMs via Reinforcement Learning

&#x1f9e0; 一、论文背景&#xff1a;为什么需要 ReSearch&#xff1f; &#x1f30d; 大语言模型&#xff08;LLM&#xff09;的问题&#xff1a; 尽管 GPT、Claude、Qwen 等 LLMs 在推理上取得了巨大进展&#xff0c;但它们仍面临几个关键挑战&#xff1a; 信息孤岛&am…...

瑞芯微芯片算法开发初步实践

文章目录 一、算法开发的一般步骤1.选择合适的深度学习框架2.对于要处理的问题进行分类&#xff0c;是回归问题还是分类问题。3.对数据进行归纳和整理4.对输入的数据进行归一化和量化&#xff0c;保证模型运行的效率和提高模型运行的准确度5.在嵌入式处理器上面运行模型&#x…...

大连理工大学选修课——机器学习笔记(1):概述

机器学习概述 机器学习的本质 机器学习是为了设计解决问题的算法。 为输入与输出建立某种映射&#xff1a; 类似于函数关系&#xff1a; Y f ( X ) Yf(X) Yf(X) 不同的映射方法体现了不同的思想。 相关概念 深度学习是机器学习的一个分支 深度学习是深层次化的神经网…...

(4)python中jupyter lab使用python虚拟环境

1. 先了解IPython和IPyKernel简介 IPython 是一个功能强大的交互式 Python 解释器和开发环境。它提供了一种增强的 Python Shell,使得用户能够以交互的方式探索、分析和可视化数据。IPython 的名称来源于 "Interactive Python",体现了其交互式的特性。 IPyKernel 是…...

VSCode Auto Rename Tag插件不生效

目录 一、问题 二、解决方法 一、问题 1.Auto Rename Tag插件安装后不生效&#xff0c;每次打开右下角都有 一个 弹框提示&#xff1a; The Auto Rename Tag server crashed 5 times in the last 3 minutes. The server will not be restarted. 大概意思&#xff1a;Auto …...

git did not exit cleanly (exit code 128) 已解决

在回退代码的时候遇到这个报错提示&#xff1a; 网上搜索的时候看到有几种解决办法&#xff1a; 1.更改地址 TortoiseGit --> "Settings" --> "Network" 将"C:\Program Files\TortoiseGit\bin\TortoiseGitPlink.exe" 修改为"C:\…...

一个完整的神经网络训练流程详解(附 PyTorch 示例)

&#x1f9e0; 一个完整的神经网络训练流程详解&#xff08;附 PyTorch 示例&#xff09; &#x1f4cc; 第一部分&#xff1a;神经网络训练流程概览&#xff08;总&#xff09; 在深度学习中&#xff0c;构建和训练一个神经网络模型并不是简单的“输入数据、得到结果”这么简…...

2025年-redis(p1-p10)

1.redis介绍 &#xff08;1&#xff09;基础&#xff1a;常见的数据结构及命令、jedis的应用和优化、springDataRedis的应用和优化 &#xff08;2&#xff09;企业实战的应用场景&#xff1a;共享session、缓存解决问题、秒杀中的redis应用、社交app中的redis应用、redis特殊结…...

一、OrcaSlicer源码编译

一、下载 1、OrcaSlicer 2.3.0版本的源码 git clone https://github.com/SoftFever/OrcaSlicer.git -b v2.3.0 二、编译 1、在OrcaSlicer目录运行cmd窗口&#xff0c;输入build_release.bat 2、如果出错了&#xff0c;可以多运行几次build_release.bat 3、在OrcaSlicer\b…...

Linux 基础IO(上)--文件与文件描述符fd

前言&#xff1a; 在生活里&#xff0c;我们常和各种文件打交道&#xff0c;像用 Word 写文档、用播放器看视频&#xff0c;这些操作背后都离不开文件的输入输出&#xff08;I/O&#xff09;。在 Linux 系统中&#xff0c;文件 I/O 操作更是复杂且关键。 接下来我们将深入探讨…...

泛微OA.E9--07--IDEA搭建后端二开环境

泛微OA.E9–07–IDEA搭建后端二开环境 一.前期准备 1.安装IDEA 2.从服务器中把ecology和JDK这几个文件拷贝到本地。 &#xff08;ecology太大的话可以不拷log日志文件&#xff09; 3.拷到本地后&#xff0c;在ecology文件下创建src文件夹 二.配置IDEA 1.启动IDEA后&#xff0…...

美的人形机器人即将投入实际应用

国内家电巨头美的集团近日公布了其自主研发的人形机器人的具体落地计划。根据公司披露的信息&#xff0c;这款机器人将于5月在湖北荆州的洗衣机工厂率先投入使用&#xff0c;承担设备运维、质量检测和物料搬运等工作任务。预计今年下半年&#xff0c;该机器人还将进入美的线下门…...

【使用小皮面板 + WordPress 搭建本地网站教程】

&#x1f680; 使用小皮面板 WordPress 搭建本地网站教程&#xff08;快速上手&#xff09; 本教程将手把手教你如何使用 小皮面板&#xff08;XAMPP 类似工具&#xff09; 和 WordPress 搭建一个完全本地化的网站环境。适合 初学者 / 博主 / Web开发者 本地练习使用&#xf…...

EWM 流程全自动化实现方法

目录 1 简介 2 实现方法 2.1 EWM 内向交货单自动创建 2.2 EWM 自动收货 2.3 当 EWM GR 的时候,自动触发 EWM 上架仓库任务。 2.4 确认 EWM 仓库任务/订单 3 写在最后 1 简介 当仓库遇到 EWM 的时候,大家首先想到的是 EWM 的业务操作多且功能复杂,甚至有些客户还会考…...

智能驾驶新时代:NVIDIA高级辅助驾驶引领未来出行安全

智能驾驶新时代&#xff1a;NVIDIA高级辅助驾驶引领未来出行安全 在全球汽车产业数字化转型的时代潮流中&#xff0c;高级辅助驾驶技术已逐渐成为推动产业革新的核心动力。作为这一领域的领导者之一&#xff0c;NVIDIA通过其先进的技术解决方案&#xff0c;正在积极塑造未来的…...

NVIDIA DRIVE AGX平台:引领智能驾驶安全新时代

随着科技的不断进步&#xff0c;汽车行业正迎来前所未有的变革&#xff0c;智能驾驶技术成为全球产业竞相布局的焦点之一。然而&#xff0c;这场技术革命的背后&#xff0c;最关键且被广泛关注的是安全性问题。近日&#xff0c;我认真研读了NVIDIA发布的《自动驾驶安全报告》白…...

聚焦数字中国|AI赋能与安全守护:Coremail引领邮件办公智能化转型

4月28日&#xff0c;第八届数字中国建设峰会在福州拉开序幕。当天&#xff0c;数字中国新产品新技术发布会开讲&#xff0c;Coremail受邀亮相现场&#xff0c;与与会嘉宾分享AI在邮件产品领域的最新应用成果和实践经验。 Coremail首席客户代表刘子建以《AI赋能与安全守护&#…...

OpenCV的grabCut算法分割图像

OpenCV计算机视觉开发实践&#xff1a;基于Qt C - 商品搜索 - 京东 基本概念 使用grabCut算法可以用最小程度的用户交互来分解前景。从用户角度来看&#xff0c;grabCut算法是怎么工作的呢&#xff1f;首先画一个矩形方块把前景图圈起来&#xff0c;前景区域应该完全在矩形内…...

[计算机科学#6]:从锁存器到内存,计算机存储的构建与原理

【核知坊】&#xff1a;释放青春想象&#xff0c;码动全新视野。 我们希望使用精简的信息传达知识的骨架&#xff0c;启发创造者开启创造之路&#xff01;&#xff01;&#xff01; 内容摘要&#xff1a;在上一篇文章中&#xff0c;我们深入了解了计算机如…...

练习001

目录 前言 数字诗意 分析 代码 封闭图形个数 分析 代码 回文数组 分析 代码 商品库存管理 分析 代码 挖矿 分析 代码 回文字符串 分析 代码 前言 好久不更新了&#xff0c;今天来更新一下。 当然不是主包偷懒啊&#xff0c;是最近的事情实在是有点多QAQ。…...

【Linux调整FTP端口】

Linux调整FTP端口 一、确保新端口未被占用在修改端口之前&#xff0c;可以使用以下命令检查端口是否被占用&#xff1a; 二、修改vsftpd配置文件1. 打开vsftpd配置文件2. 找到并修改端口配置3. 保存并退出4. 重启vsftpd服务 三、配置防火墙 在Linux系统中修改FTP端口&#xff0…...

spring中的@Configuration注解详解

一、概述与核心作用 Configuration是Spring框架中用于定义配置类的核心注解&#xff0c;旨在替代传统的XML配置方式&#xff0c;通过Java代码实现Bean的声明、依赖管理及环境配置。其核心作用包括&#xff1a; 标识配置类&#xff1a;标记一个类为Spring的配置类&#xff0c;…...

AI中常用概念的理解

1. RAG&#xff08;检索增强生成&#xff09; 通俗理解&#xff1a;就像你写作业时&#xff0c;先查课本 / 百度找资料&#xff0c;再根据资料写答案&#xff0c;而不是纯靠记忆瞎编。 AI 模型&#xff08;比如 ChatGPT&#xff09;回答问题时&#xff0c;先去 “数据库 / 互联…...