Polymer 2.0获取纸张输入文件

Question

我正在使用Polymer 2.0.我有一个

<paper-input type="file" id"myFile"></paper-input>

一旦我选择了一个文件,我想使用Polymer(javascript)来获取文件的引用和详细信息.以前我用过

this.$.myFile.inputElement.files[0]; 

但这似乎现在不起作用,它说未定义.请帮我看一下这个文件.这是一个jsbin:

https://jsbin.com/luledugege/edit?html,console,output

Answer 1

试试这个:

this.$.myFile.inputElement.inputElement.files[0]

paper-input有属性inputElement来获取它的铁输入.反过来,这个元素在其shadow root中具有files属性的本机输入.

您的输入可能是:

<link rel="import" href="../bower_components/polymer/polymer-element.html">
<link rel="import" href="../bower_components/paper-input/paper-input.html">

<dom-module id="my-paper-input-file">
  <template>
    <style>
      :host {
        display: block;
        padding: 10px;
      }
    </style>

    <paper-input type="file" id="myFile" on-change="_handleFiles"></paper-input>

  </template>

  <script>
    class MyPaperInputFile extends Polymer.Element {

      static get is() { return 'my-paper-input-file'; }

      static properties() {

        files: Object

      }

      _handleFiles(e) {
        this.files = this.$.myFile.inputElement.inputElement.files;
        //SAME: this.files = e.target.inputElement.inputElement.files;
      }

    }

    window.customElements.define(MyPaperInputFile.is, MyPaperInputFile);
  </script>
</dom-module>