react + ts 中 // 编辑器配置 const editorConfig: Partial<IEditorConfig> = { // 在编辑器中,点击选中“附件”节点时,要弹出的菜单 hoverbarKeys: { attachment: { menuKeys: ['downloadAttachment'], // “下载附件”菜单 }, }, MENU_CONF: { // 自定义上传图片 uploadImage: { async customUpload(file: File, insertFn: any) { try { const formData = new FormData(); formData.append('file', file); fetchApi(uploadImgFile, { param: formData, onRequestSuccessfull: (ret: any) => { const url = fileSever + ret?.result?.name; const alt = ret?.result?.originalName; const href = fileSever + ret?.result?.name; insertFn(url, alt || '', href || ''); }, }); } catch (error) { console.log(error); } }, }, // 自定义上传视屏 uploadVideo: { async customUpload(file: File, insertFn: any) { try { const formData = new FormData(); formData.append('file', file); fetchApi(uploadImgFile, { param: formData, onRequestSuccessfull: (ret: any) => { const url = fileSever + ret?.result?.name; const alt = ret?.result?.originalName; const href = fileSever + ret?.result?.name; insertFn(url, alt || '', href || ''); }, }); } catch (error) { console.log(error); } }, }, uploadAttachment: { // 自定义上传附件 async customUpload(file: File, insertFn: any) { try { const formData = new FormData(); formData.append('file', file); fetchApi(uploadImgFile, { param: formData, onRequestSuccessfull: (ret: any) => { const url = fileSever + ret?.result?.name; const name = ret?.result?.originalName; insertFn(url, name); }, }); } catch (error) { console.log(error); } }, }, }, };配置了自定义上传附件,但是在上传附件时没有执行自定义上传附件的服务,控制台报错‘Uncaught (in promise) Error: Cannot get upload server address 没有配置上传地址’

时间: 2024-04-27 20:21:16 浏览: 16
根据你提供的信息,错误信息显示没有配置上传地址。你需要检查一下 fetchApi 函数调用的 uploadImgFile 参数是否配置正确。此外,你也可以检查一下后端服务是否可以正常访问。如果这些都没有问题,你可以尝试在自定义上传附件的回调函数 onRequestSuccessfull 中打印一下 ret 参数,看看是否正确返回了上传附件的信息。
相关问题

react 中 // 编辑器配置 const editorConfig: Partial<IEditorConfig> = { // 在编辑器中,点击选中“附件”节点时,要弹出的菜单 hoverbarKeys: { attachment: { menuKeys: ['downloadAttachment'], // “下载附件”菜单 }, }, MENU_CONF: { // “上传附件”菜单的配置 uploadAttachment: { customUpload: true, // 开启自定义上传 onUpload(file: File) { // 调用自定义的上传方法 console.log(file); }, // 插入到编辑器后的回调 onInsertedAttachment(elem: any) { console.log('inserted attachment', elem); }, }, }, }; customUpload: true, // 开启自定义上传 没有生效

在代码中设置 `customUpload: true` 是开启自定义上传的关键步骤,但仅仅设置此配置是不够的,你还需要将 `uploadAttachment` 菜单的 `customUpload` 属性也设置为 `true`。在你提供的代码中,仅仅是对 `uploadAttachment` 菜单进行了配置,但是没有设置其 `customUpload` 属性。因此,你需要将代码修改为如下形式: ``` const editorConfig: Partial<IEditorConfig> = { // 在编辑器中,点击选中“附件”节点时,要弹出的菜单 hoverbarKeys: { attachment: { menuKeys: ['downloadAttachment'], // “下载附件”菜单 }, }, MENU_CONF: { // “上传附件”菜单的配置 uploadAttachment: { customUpload: true, // 开启自定义上传 onUpload(file: File) { // 调用自定义的上传方法 console.log(file); }, // 插入到编辑器后的回调 onInsertedAttachment(elem: any) { console.log('inserted attachment', elem); }, }, }, }; ``` 修改后,你的自定义上传方法应该可以生效了。

const DemoPage: React.FC = () => { return ( <></> ) } export default DemoPage;中增加设计代码

当然可以,下面是一个示例设计代码的例子: ```jsx import React from 'react'; import { Button, Typography } from 'antd'; const { Title, Paragraph } = Typography; const DemoPage: React.FC = () => { return ( <> <Title level={2}>这是一个示例设计</Title> <Paragraph> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vel ante vitae libero pharetra iaculis. Nullam vel ornare sapien, sed commodo libero. Sed dapibus egestas suscipit. In eget est nulla. Sed commodo, est vel accumsan blandit, nulla massa sodales diam, vel tincidunt risus lorem nec metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent non ante sed risus mattis consequat quis vel velit. Duis vel magna ut odio euismod feugiat. Integer auctor, dui et posuere bibendum, odio elit tincidunt ipsum, sit amet congue velit justo vel ligula. Maecenas cursus, quam ut tincidunt maximus, nulla enim convallis quam, at molestie ipsum nulla vel mauris. </Paragraph> <Button type="primary" size="large"> 这是一个按钮 </Button> </> ); }; export default DemoPage; ``` 这里我们使用了 Ant Design 的 Typography 和 Button 组件,创建了一个标题、一个段落和一个按钮。你可以根据你的需要添加更多组件或修改现有组件的样式。注意,这段代码需要在 React 项目中的某个组件中使用才能正常显示。

相关推荐

最新推荐

recommend-type

React中使用UEditor百度富文本的方法

本文将介绍笔者在React的项目中使用百度的富文本编辑器Ueditor的过程。注意本文不提供一条龙式的使用方法,只是将使用过程中的一些实现思路进行总结,供以参考。react项目中导入ueditor,会存在各种不正交的问题,...
recommend-type

真正解决百度编辑器UEditor上传图片跨域问题.docx

真正解决百度编辑器UEditor上传图片跨域问题 真正解决百度编辑器UEditor上传图片跨域问题 真正解决百度编辑器UEditor上传图片跨域问题
recommend-type

基于springboot+vue+MySQL实现的在线考试系统+源代码+文档

web期末作业设计网页 基于springboot+vue+MySQL实现的在线考试系统+源代码+文档
recommend-type

zigbee-cluster-library-specification

最新的zigbee-cluster-library-specification说明文档。
recommend-type

管理建模和仿真的文件

管理Boualem Benatallah引用此版本:布阿利姆·贝纳塔拉。管理建模和仿真。约瑟夫-傅立叶大学-格勒诺布尔第一大学,1996年。法语。NNT:电话:00345357HAL ID:电话:00345357https://theses.hal.science/tel-003453572008年12月9日提交HAL是一个多学科的开放存取档案馆,用于存放和传播科学研究论文,无论它们是否被公开。论文可以来自法国或国外的教学和研究机构,也可以来自公共或私人研究中心。L’archive ouverte pluridisciplinaire
recommend-type

MATLAB柱状图在信号处理中的应用:可视化信号特征和频谱分析

![matlab画柱状图](https://img-blog.csdnimg.cn/3f32348f1c9c4481a6f5931993732f97.png) # 1. MATLAB柱状图概述** MATLAB柱状图是一种图形化工具,用于可视化数据中不同类别或组的分布情况。它通过绘制垂直条形来表示每个类别或组中的数据值。柱状图在信号处理中广泛用于可视化信号特征和进行频谱分析。 柱状图的优点在于其简单易懂,能够直观地展示数据分布。在信号处理中,柱状图可以帮助工程师识别信号中的模式、趋势和异常情况,从而为信号分析和处理提供有价值的见解。 # 2. 柱状图在信号处理中的应用 柱状图在信号处理
recommend-type

hive中 的Metastore

Hive中的Metastore是一个关键的组件,它用于存储和管理Hive中的元数据。这些元数据包括表名、列名、表的数据类型、分区信息、表的存储位置等信息。Hive的查询和分析都需要Metastore来管理和访问这些元数据。 Metastore可以使用不同的后端存储来存储元数据,例如MySQL、PostgreSQL、Oracle等关系型数据库,或者Hadoop分布式文件系统中的HDFS。Metastore还提供了API,使得开发人员可以通过编程方式访问元数据。 Metastore的另一个重要功能是跟踪表的版本和历史。当用户对表进行更改时,Metastore会记录这些更改,并且可以让用户回滚到
recommend-type

JSBSim Reference Manual

JSBSim参考手册,其中包含JSBSim简介,JSBSim配置文件xml的编写语法,编程手册以及一些应用实例等。其中有部分内容还没有写完,估计有生之年很难看到完整版了,但是内容还是很有参考价值的。
recommend-type

"互动学习:行动中的多样性与论文攻读经历"

多样性她- 事实上SCI NCES你的时间表ECOLEDO C Tora SC和NCESPOUR l’Ingén学习互动,互动学习以行动为中心的强化学习学会互动,互动学习,以行动为中心的强化学习计算机科学博士论文于2021年9月28日在Villeneuve d'Asq公开支持马修·瑟林评审团主席法布里斯·勒菲弗尔阿维尼翁大学教授论文指导奥利维尔·皮耶昆谷歌研究教授:智囊团论文联合主任菲利普·普雷教授,大学。里尔/CRISTAL/因里亚报告员奥利维耶·西格德索邦大学报告员卢多维奇·德诺耶教授,Facebook /索邦大学审查员越南圣迈IMT Atlantic高级讲师邀请弗洛里安·斯特鲁布博士,Deepmind对于那些及时看到自己错误的人...3谢谢你首先,我要感谢我的两位博士生导师Olivier和Philippe。奥利维尔,"站在巨人的肩膀上"这句话对你来说完全有意义了。从科学上讲,你知道在这篇论文的(许多)错误中,你是我可以依
recommend-type

MATLAB柱状图在数据分析中的作用:从可视化到洞察

![MATLAB柱状图在数据分析中的作用:从可视化到洞察](https://img-blog.csdnimg.cn/img_convert/1a36558cefc0339f7836cca7680c0aef.png) # 1. MATLAB柱状图概述** 柱状图是一种广泛用于数据可视化的图表类型,它使用垂直条形来表示数据中不同类别或组别的值。在MATLAB中,柱状图通过`bar`函数创建,该函数接受数据向量或矩阵作为输入,并生成相应的高度条形。 柱状图的优点在于其简单性和易于理解性。它们可以快速有效地传达数据分布和组别之间的比较。此外,MATLAB提供了广泛的定制选项,允许用户调整条形颜色、