layui重载、layui upload重新选择

在使用Layui框架进行文件上传时，有时会遇到需要重载upload模块或者重新选择文件的情况。解决这个问题的核心思路是：通过销毁当前的upload实例，再重新初始化upload模块，或者利用Layui提供的接口方法来实现文件重新选择。

一、销毁重建方式

这种方式比较直接。引入layui，假设我们有一个文件上传按钮：

html <button type="button" class="layui-btn" id="test">上传图片</button>

然后定义一个全局变量用于存储upload实例：

javascript
var uploadInst = null;
layui.use('upload', function(){
  var upload = layui.upload;</p>

<p>// 先销毁之前的实例（如果存在）
  if(uploadInst){
    uploadInst.destroy();
  }</p>

<p>// 再重新初始化
  uploadInst = upload.render({
    elem: '#test'
    ,url: '/upload/' //改成你的上传接口
    ,done: function(res){
      console.log(res);
    }
  });
});

当需要重新选择文件时，可以再次调用上面的代码逻辑，这样就实现了重载和重新选择。

二、利用choose方法

Layui提供了更优雅的方式。我们可以只初始化一次upload，然后在需要重新选择的时候调用choose方法：

html <button type="button" class="layui-btn" id="test1">上传图片</button>

javascript
layui.use('upload', function(){
  var upload = layui.upload;</p>

<p>// 初始化
  var uploadInst = upload.render({
    elem: '#test1'
    ,url: '/upload/'
    ,done: function(res){
      console.log(res);
    }
  });</p>

<p>// 需要重新选择时
  document.getElementById("reselect").addEventListener("click",function(){
    uploadInst.config.choose(); // 调用choose方法触发重新选择
  });
});

这种方式不需要频繁地销毁和重建实例，性能上更优，并且代码也更加简洁。

以上两种方法都可以很好地解决layui upload重新选择的问题，在实际开发中可以根据具体需求选择合适的方法。如果是简单的页面，种方法足够使用；如果是复杂的单页应用，推荐使用第二种方法。