在使用 layui 上傳功能，在頁面同時綁定多個元素，並將屬性設定在 lay-data 上時，報錯 Layui hint: Upload element property lay-data configuration item has a syntax error
解決方法 : 將 {url 改為 { url ，中間加入個空格。
此為layui文檔代碼段
【HTML】 <button class="layui-btn test" lay-data="{url: '/a/'}">上傳圖片</button> <button class="layui-btn test" lay-data="{url: '/b/', accept: 'file'}">上傳文件</button> 【JS】 upload.render({ elem: '.test' ,done: function(res, index, upload){ //獲取當前觸發上傳的元素，一般用於 elem 綁定 class 的情況，注意：此乃 layui 2.1.0 新增 var item = this.item; } })
簡單的制作了個頁面測試:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>layui 文件上傳</title> <link rel="stylesheet" href="__STATIC__/layui/css/layui.css" media="all"> </head> <body> <button type="button" class="layui-btn" id="test1"> <i class="layui-icon"></i>上傳圖片 </button> <button class="layui-btn test" lay-data="{url: 'upload/'}">上傳圖片</button>
<!-- 此處在 {url 中間加了個空格 --> <button class="layui-btn test" lay-data="{ url: 'upload/', accept: 'file'}">上傳文件</button> <script src="__STATIC__/layui/layui.js"></script> <script> layui.use('upload', function(){ var upload = layui.upload; upload.render({ elem: '.test' ,done: function(res, index, upload){ //獲取當前觸發上傳的元素，一般用於 elem 綁定 class 的情況，注意：此乃 layui 2.1.0 新增 var item = this.item; } }) }); </script> </body> </html>
未更改前報錯
參考：https://blog.csdn.net/weixin_36691991/article/details/89352807