【若依(ruoyi)】layui upload
生活随笔
收集整理的這篇文章主要介紹了
【若依(ruoyi)】layui upload
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
前言
- ruoyi 4.6.0
- layui 2.3.0
layui upload
若依的默認(rèn)上傳組件雖然是bootstrap-fileinput(這里,這里,這里),但還是可以使用layui upload。
若依未包含layui的upload組件,自己去(這里)下載upload組件并引入即可。
使用
<!DOCTYPE html> <html> <head><meta charset="utf-8"><title>layui</title><meta name="renderer" content="webkit"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"><link rel="stylesheet" th:href="@{/layui/css/layui.css" media="all"> </head> <body><div class="layui-upload"><button type="button" class="layui-btn" id="btn1">上傳圖片</button><div class="layui-upload-list"><img class="layui-upload-img" id="preview1" width="150px"></div> </div> <script th:src="@{/layui/layui.js}" charset="utf-8"></script> <script> layui.use('upload', function(){var $ = layui.jquery,upload = layui.upload;//圖片上傳var uploadInst = upload.render({elem: '#btn1',url: ctx+'common/upload',auto: true /*選中后,立即上傳*//*上傳完成后的回調(diào)函數(shù)*/,done: function(res){//上傳成功// 預(yù)覽已上傳的圖片$('#preview1').attr('src', res.url); // 提示return layer.msg(res.msg,{icon: res.status,time: 2000});}});}); </script></body> </html>更多
參考這里。
與50位技術(shù)專家面對面20年技術(shù)見證,附贈技術(shù)全景圖總結(jié)
以上是生活随笔為你收集整理的【若依(ruoyi)】layui upload的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 九天仙梦-PK系统
- 下一篇: 《艾诺迪亚2:罗恩流浪者》主线攻略【四】