zoukankan      html  css  js  c++  java
  • 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()
    
              })
    
            })
    
          }
    
        }
  • 相关阅读:
    python数据类型以及模块的含义
    python基础语言以及if/while语句结构
    subprocess模块
    linux 管道通信socket 全双工示例
    整体框架
    licode_WebrtcConnection
    webrtc杂谈(转)
    修改背景颜色
    激活NX窗口的按钮
    NX屏蔽窗口的按钮
  • 原文地址:https://www.cnblogs.com/zhangyezi/p/13223359.html
Copyright © 2011-2022 走看看