关于使用LayUIAdmin富文本上传图片时,上传成功但是报错的解决办法(LayUI踩坑篇六)

文中的LayUIAdminPro版本为v2020.4.1。使用的软件是IDEA,你问我为什么不用vsCode?为了偷懒,就使用IDEA。

如果你把LayUI的成功码改为200,那么,富文本上传时,就会出现,明明上传成功,服务器上也有上传的图片,但是就是提示上传失败的问题。
在这里插入图片描述
那我们就需要修改start/layui/lay/modules/layedit.js文件。
在这里插入图片描述
打开后是这样的,我们需要使用快捷键Ctrl+Alt+L,格式化代码。
在这里插入图片描述
格式化后的代码如下图。
在这里插入图片描述
如果我们要找到富文本上传图片的相关代码。复制下面代码搜索即可,下图中,圈起来的就是上传相关的代码了。

layui.use("upload", function (o) {

在这里插入图片描述
修改代码,图中,需要把状态码改为200,src是图片的路径,d.data是返回的数据,url是图片的路径(如:jpg/1.jpg),layui.setter.images是src/config.js文件中的images属性,两者拼接才是一个完整的图片路径;alt是图片没加载出来时显示的文字,其实这个属性删掉也是可以的。
在这里插入图片描述
src/config.js文件中的images属性,在此文件中定义的属性,在其他文件中使用layui.setter.xxx即可引用。方便我们后期改域名时,不需要在项目中到处去修改。
在这里插入图片描述
同理在table.render请求时,也可以使用layui.setter中设置的url。
在这里插入图片描述

layui.use("upload", function (o) {
    var r = l.uploadImage || {};
    o.render({
        url: r.url, method: r.type, elem: e(n).find("input")[0], done: function (e) {
            200 == e.code ? (e.data = e.data || {}, v.call(t, "img", {
                src: layui.setter.images + e.data.url,
                alt: e.data.title
            }, a)) : i.msg(e.msg || "上传失败")
        }
    })
})

修改后,回到页面,重新上传图片即可成功上传并显示图片。
在这里插入图片描述

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值