【Layui】解决如何使用富文本编辑器和富文本上传显示图片

【Layui】解决如何使用富文本编辑器和富文本上传显示图片

【摘要】 01 添加富文本 首先添加富文本的代码 然后就可以直接看到效果了 操作上边的前提是你的标签必须是textarea,并且设置有id 02 富文本上传图片 这里文档也写的很清楚,需要添加上传图片的接口 最后项目展示就是这个样子的,这里需要切记的是上传图片的配置要在构建之前 然后上传图片 …

01

添加富文本

 

首先添加富文本的代码

aHR0cDovL2ltZy45NndlaXhpbi5jb20vdWVkaXRvci8yMDE5MTEwNi8xNTczMDE0MDg1NjcyNTc5LnBuZw

然后就可以直接看到效果了

aHR0cDovL2ltZy45NndlaXhpbi5jb20vdWVkaXRvci8yMDE5MTEwNi8xNTczMDE0MTM0MTM0NDEzLnBuZw

操作上边的前提是你的标签必须是textarea,并且设置有id

aHR0cDovL2ltZy45NndlaXhpbi5jb20vdWVkaXRvci8yMDE5MTEwNi8xNTczMDE0MjYzODM2MTcyLnBuZw

 

02

富文本上传图片

 

这里文档也写的很清楚,需要添加上传图片的接口

 

aHR0cDovL2ltZy45NndlaXhpbi5jb20vdWVkaXRvci8yMDE5MTEwNi8xNTczMDE0MzMwMjUwOTUzLnBuZw

最后项目展示就是这个样子的,这里需要切记的是上传图片的配置要在构建之前

aHR0cDovL2ltZy45NndlaXhpbi5jb20vdWVkaXRvci8yMDE5MTEwNi8xNTczMDE0MzcyNjYwMjkyLnBuZw

然后上传图片

 

aHR0cDovL2ltZy45NndlaXhpbi5jb20vdWVkaXRvci8yMDE5MTEwNi8xNTczMDE0NDI1MTM1Njg3LnBuZw

 

03

注意点

 

在上面俩步已经把代码都修改好了,这是还有一个注意点,我们来看看文档

这个是layui上传图片返回的格式,我们必须严格执行

 

aHR0cDovL2ltZy45NndlaXhpbi5jb20vdWVkaXRvci8yMDE5MTEwNi8xNTczMDE0NTU3NjM3OTE5LnBuZw

所以我们还需要上传图片之后的返回格式,至于怎么写上传图片的功能自行解决哈!

 

aHR0cDovL2ltZy45NndlaXhpbi5jb20vdWVkaXRvci8yMDE5MTEwNi8xNTczMDE0NjQ4OTgwNTEzLnBuZw

 

文章来源: blog.csdn.net,作者:咔咔-,版权归原作者所有,如需转载,请联系作者。

原文链接:blog.csdn.net/fangkang7/article/details/102932803