elementUi 上传文件实现action动态改变

elementUi有bug :action="url"不能动态改变

解决方法：

1.action是一个必填参数，且其类型为string，我们把action写成:action，然后后面跟着一个方法名，调用方法，返回你想要的地址，实现动态的去修改上传地址

方法一

<el-upload  :action="UploadUrl()"  :on-success="UploadSuccess" :file-list="fileList">

    <el-button size="small" type="primary" >点击上传</el-button>

</el-upload>

// js 代码在 methods中写入需要调用的方法

methods:{

    UploadUrl:function(){

        return "返回需要上传的地址";   

    } 

}

 

组件设计时，并不考虑改变原始值。 并且Vue的一些机制导致了这个问题

方法二：在:before-upload 中动态改变url值

当url为后台返回的数据时使用

<el-upload class="upload-demo" :action="url" :before-upload="test">

  <el-button size="small" type="primary">点击上传</el-button>

</el-upload>

data () {

      return {

        url: '123'

      };

    },

    methods: {

      test (file) {

        return new Promise((resolve, reject) => {

          this.$nextTick(() => {

            this.url = '321'       

            resolve()

          })

        })

      }

    }