Question

如何添加进度条。我使用eric bidelman提供的代码在这里=＆gt; Polymer Core-Ajax File upload

downloadinit: function( event, detail, sender ){
            this.files = sender.files;
            for ( var i = 0; i < this.files.length; i++ ) {
                var file = this.files[i]
                this.uploadsize += file.size;
                this.fileList[this.uploadPop] = file.name;
                this.uploadPop += 1;
            }

            event.stopPropagation(); // Stop stuff happening
            event.preventDefault(); // Totally stop stuff happening

            for( var i = 0, f; f = this.files[i]; ++i) {
                this.data.append( sender.name, f, f.name );
            }
            this.queryUrl2 = "projects/submit.php?pjid="+this.projDetails.projectid;
            this.submitBody = this.data;
            this.$.ajaxAction2.contentType = null;
        },
        triggerDownload: function(){
            this.$.ajaxAction2.go();
            data = new FormData;
            this.files = null;
            this.fileList = [];
            this.submitBody = null;
            this.uploadsize = 0;
            this.uploadPop = 0;
        },

Answer 1

您可以添加“加载”面具。

<template>
<form>
   <paper-input type="File" label="Choose File" ... ></paper-input>
   <paper-button label="Send" on-click="{{sendData}}" raisedButton></paper-button>
</form>
<core-ajax id="ajax" url="/upload"
           method="POST"
           on-core-response="{{onResponse}}"
           ....
></core-ajax>
</template>
<script>
sendData: function () {
    ...
    this.$.ajax.go();
    this.spiningLoadingMask(true);
    ...
},

onResponse: function () {
    ...
    this.spiningLoadinMask(false);
    ...
},

spiningLoadingMask: function (val) {
    if(val){
    ... //start moving the wheel
    } else {
    ... //stop that wheel
    }
}
</script>

这样的东西可以起作用，没有'进度条'，但是旋转轮是一个不错的选择。

Answer 2

有一个拉取请求实现了缺失的功能https://github.com/Polymer/core-ajax/pull/27

Polymer core-ajax文件上传进度

2 个答案: