在使用 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