Question

我是打字稿的新手。在我的Durandal应用程序中，我迁移到VS-2012到VS-2015意味着打字稿0.9到打字稿1.8.4。迁移后，我遇到了很多构建错误。我解决了除了一个以外的所有人我在事件类型上遇到了构建错误。

错误：“构建：属性'结果'在类型'EventTarget'上不存在”

代码如下所示：

var reader:any,
target:EventTarget;

reader= new FileReader();
reader.onload = function (imgsrc){
    var fileUrl = imgsrc.target.result;
}

“Imgsrc”正在进行类型事件。

使用typescript 0.9可以正常工作但是1.8.4它会抛出错误，因为“EventTarget”类型中不存在“结果”。任何人都可以帮忙解决这个问题。

注意：“target：EventTarget”来自lib.d.ts

Answer 1

虽然 any 是一种药（几乎对于任何事情，但......那么TypeScript的好处在哪里） ......也有类似的问题报告并且很好（TypesScript-ish）建议的解决方法

Request to change currentTarget in Event interface for lib.d.ts

让我引用：

我遇到了这个TS2339：属性'结果'在类型上不存在   JS FileReader onload中的'EventTarget'，以及另一个警告   传递给FileReader的错误事件的getSummary（）。

我的解决方法，压制可怕的红色波浪线;-)是   以下内容：
interface FileReaderEventTarget extends EventTarget {
    result:string
}

interface FileReaderEvent extends Event {
    target: FileReaderEventTarget;
    getMessage():string;
}
然后在我的应用中：
reader.onload = function(fre:FileReaderEvent) {
    var data = JSON.parse(fre.target.result);
    ...
}

并且，在lib.d.ts中进行一些更改之前，我们仍然使用已知接口

Answer 2

您可以使用event.target.result。

，而不是使用FileReader.result

例如，

const fileReader: FileReader = new FileReader();

fileReader.onload = (event: Event) => {
   event.target.result; // This is invalid
   fileReader.result; // This is valid
};

Answer 3

使用我的旧类型脚本，默认情况下参数“imgsrc”具有任何类型。

所以，现在我把它作为（imgsrc：any）。它工作正常。

var reader:any,
target:EventTarget;
reader= new FileReader();
reader.onload = function (imgsrc:any){
var fileUrl = imgsrc.target.result;
}

Answer 4

问题在于打字稿定义。一个简单的骗子是：

let target: any = e.target; //<-- This (any) will tell compiler to shut up!
let content: string = target.result;

Answer 5

只需让TypScript知道您希望它是哪种类型即可。

这里是解决方法：

let reader = new FileReader();
reader.onload = function (event){
    let fileUrl = (<FileReader>event.target).result;
}

在这种情况下，您也可以使用reader.result

Answer 6

今天这在TypeScript 2.1.1中适用于我

protected void paintComponent(Graphics g)

Answer 7

代替

    this.localDbRequest.onsuccess = function (event) {
      const db = event.target.result;
    };

做

   this.localDbRequest.onsuccess = function (event) {
     const db = this.result;
   };

Answer 8

如果出现此错误
键入“字符串| ArrayBuffer'不能分配给'string'类型。不能将“ ArrayBuffer”类型分配给“字符串”类型

fileReader.result +''; //有效
fileReader.result; //无效

Answer 9

我在使用FileReader时遇到了同样的问题。

解决方案非常简单（Typescript具有必需的类型）。您必须使用ProgressEvent<FileReader>。可以在打字稿安装中的lib.dom.d.ts中找到它，因此如果您使用{p>

lib: {
"dom"
}

在您的tsconfig.json中。

这是我必须使用的代码：

function read(file: File) {
  const fileReader = new FileReader();
  fileReader.onloadend = function (e: ProgressEvent<FileReader>) {
    const arr = (new Uint8Array(parseInt(e.target.result.toString(), 10))).subarray(0, 4);
    var header = "";
    for (var i = 0; i < arr.length; i++) {
      header += arr[i].toString(16);
    }
    console.log(header);

    // Check the file signature against known types

  };
  fileReader.readAsArrayBuffer(file);
}

Answer 10

这是javascript / typescript的休息更改。

你需要做的就是用“this.result”替换“event.target.result”。

“this”在这里指的是接口“MSBaseReader”的上下文。

下面是我的实施摘录：

      let reader = new FileReader();
      let profile: TransProfile = new TransProfile();

      reader.onload = function(event){
        profile.avatar = new Uint8Array(this.result);
      }

      reader.onerror = function(event){
      }

      this.photoLib.getPhoto(item)
        .then(blob => reader.readAsArrayBuffer(blob))
        .then(() => this.doUpload(profile));

“MSBaseReader”接口定义：

interface MSBaseReader {
    onabort: (this: MSBaseReader, ev: Event) => any;
    onerror: (this: MSBaseReader, ev: ErrorEvent) => any;
    onload: (this: MSBaseReader, ev: Event) => any;
    onloadend: (this: MSBaseReader, ev: ProgressEvent) => any;
    onloadstart: (this: MSBaseReader, ev: Event) => any;
    onprogress: (this: MSBaseReader, ev: ProgressEvent) => any;
    readonly readyState: number;
    readonly result: any;
    abort(): void;
    readonly DONE: number;
    readonly EMPTY: number;
    readonly LOADING: number;
    addEventListener<K extends keyof MSBaseReaderEventMap>(type: K, listener: (this: MSBaseReader, ev: MSBaseReaderEventMap[K]) => any, useCapture?: boolean): void;
    addEventListener(type: string, listener: EventListenerOrEventListenerObject, useCapture?: boolean): void;
}

“FileReader”接口定义

interface FileReader extends EventTarget, MSBaseReader {
    readonly error: DOMError;
    readAsArrayBuffer(blob: Blob): void;
    readAsBinaryString(blob: Blob): void;
    readAsDataURL(blob: Blob): void;
    readAsText(blob: Blob, encoding?: string): void;
    addEventListener<K extends keyof MSBaseReaderEventMap>(type: K, listener: (this: FileReader, ev: MSBaseReaderEventMap[K]) => any, useCapture?: boolean): void;
    addEventListener(type: string, listener: EventListenerOrEventListenerObject, useCapture?: boolean): void;
}

还要注意，由于“onload（）”中“this”的上下文更改，在“reader.onload = function（event）{...”中无法访问基于类的定义;意思是你不能使用“this.class-property”样式来解决你的类属性。

您必须定义局部变量。请参阅上面摘录中“个人资料”的定义和用法。

Answer 11

可以通过以下方式访问 target 对象，以防止错误，直到修复：

reader= new FileReader();
reader.onload = function (imgsrc){
    var fileUrl = imgsrc.target["result"];
}

将目标作为Javascript对象处理

Answer 12

以上解决方案与我与IndexedDB的类似问题不符，所以我认为我将分享在我的方案中起作用的内容。通过将(event)函数的参数更改为(event: any)，我可以忽略类型错误。

示例代码：

let request = window.indexedDB.open('userChannels', 3);

request.onerror = function(event: any ) {
    console.log('ERROR: Failed to create userChannels local DB' + event.target.errorCode)
  };

request.onsuccess = function(event: any) {
   let db = event.target.result;
   console.log('SUCCESS: Created userChannels local DB')
};

Answer 13

如果有人正在寻找最简单的解决方案，那么 this为我工作。

<button onClick={() => {download({publicKey: '12345', name: 'image.jpg'})}}>Download</button>

Answer 14

尝试一下。

event.target["result"]

Answer 15

经过 lib.dom.d.ts 分析后很简单：

const fileReader: FileReader = new FileReader();

fileReader.onload = (event: ProgressEvent<FileReader>) => {
   event.target.result; // This is valid
};

新的Typescript 1.8.4构建错误：“构建：属性'结果'在类型'EventTarget'上不存在。”

15 个答案:

Request to change currentTarget in Event interface for lib.d.ts