layui前端上次图片代码

如果您是想在 layui 中展示图片，可以使用下面的代码：

<!-- HTML 代码 -->
<div class="layui-upload">
  <button type="button" class="layui-btn" id="test1">上传图片</button>
  <div class="layui-upload-list">
    <img class="layui-upload-img" src="" id="demo1">
    <p id="demoText"></p>
  </div>
</div>

// JavaScript 代码
layui.use('upload', function(){
  var upload = layui.upload;
  
  //执行实例
  var uploadInst = upload.render({
    elem: '#test1' //绑定元素
    ,url: '/upload/' //上传接口
    ,done: function(res){
      //上传完毕回调
      $('#demo1').attr('src', res.data.url); //将上传的图片路径设置到 img 标签的 src 属性中
    }
    ,error: function(){
      //请求异常回调
    }
  });
});

上面的代码中，我们使用了 layui 中的上传组件，当用户点击“上传图片”按钮时，会触发上传组件的回调函数，将上传的图片路径设置到 img 标签的 src 属性中，从而实现在 layui 中展示图片的功能。