Editor.md - 开源在线 Markdown 编辑器

放于public文件夹下

html代码：

				<div class="layui-col-md12" id="content"><textarea name="content"  placeholder="详情" class="layui-textarea">{notempty name="rs['content']"}{$rs['content']}{/notempty}</textarea></div>

js代码

<!-- Editor.md 编辑器 开始  -->
<link rel="stylesheet" href="__STATIC__/editormd/css/editormd.css" />
<script src="__STATIC__/jquery/3.6.0/jquery.min.js"></script>
<script src="__STATIC__/editormd/editormd.min.js"></script>
<script type="text/javascript">var testEditor;$(function() {testEditor = editormd("content", {width   : "100%",height  : 320,// watch : false,// syncScrolling : "single",path    : "__STATIC__/editormd/lib/",htmlDecode : "style,script,iframe|on*",/**上传图片相关配置如下*/imageUpload : true,//开启上传图片吗？imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],//图片支持的格式imageUploadURL : "{:url('common/uploads',['filetype'=>0])}",//上传图片使用方法 saveHTMLToTextarea : true,//这个配置，方便post提交html源码表单，保存 HTML 到 Textarea它关乎后端是否可以获取到值emoji: true,taskList: true, tocm: true,         // Using [TOCM]tex: true,                   // 开启科学公式TeX语言支持，默认关闭flowChart: true,             // 开启流程图支持，默认关闭sequenceDiagram: true,       // 开启时序/序列图支持，默认关闭,toolbarIcons : function() {  //自定义工具栏，后面有详细介绍return editormd.toolbarModes['full']; // full, simple, mini},});});
</script>
<!-- Editor.md 编辑器 结束  -->

重点，上传图片接口

/**上传图片相关配置如下*/

            imageUpload : true,//开启上传图片吗？

            imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],//图片支持的格式

            imageUploadURL : "{:url('common/uploads',['filetype'=>0])}",//上传图片使用方法

            saveHTMLToTextarea : true,//这个配置，方便post提交html源码表单，保存 HTML 到 Textarea它关乎后端是否可以获取到值

上传成功后台返回json样式如下：

{success : 0 | 1, //0表示上传失败;1表示上传成功message : "提示的信息",url     : "图片地址" //上传成功时才返回
}

php接收表单部分

$file = request()->file('editormd-image-file');

用这个
$file = request()->file('editormd-image-file');而不是用这个接收
$file = request()->file('file');
这个接收为空

参考：

THINKPHP框架中引入Markdown编辑器和解决Github emoji图标无法显示_markdown php编辑器-CSDN博客

Thinkphp5中引入Markdown编辑器 - 代码先锋网