Question

如何获取对文件阅读器结果的访问权限，并且还可以访问类成员。

我正在使用TypeScript。以下是我的尝试和结果：

班级成员函数：

 doSomething() {

  }

尝试：

标准功能：

  aprocList(file) {
    const reader = new FileReader();
    reader.addEventListener('load', function () {
      const a = this.result;  // FileReader OK
      this.doSomething(); // this is  FileReader =  fail.

    }, false);

    reader.readAsDataURL(file);

  }

箭头功能：

  bprocList(file) {
    const reader = new FileReader();
    reader.addEventListener('load', () => {
      const a = this.result // this is the class instance = fail.
      this.doSomething(); // OK

    }, false);

    reader.readAsDataURL(file);


  }

保存课程参考： 为什么这是失败我不确定，但这是我期望的解决方案：

  cprocList(file) {
    const that = this;
    const reader = new FileReader();
    reader.addEventListener('load', function () {
      const a = this.result; // OK.
      console.log(that); // that is undefined.
      // that.doSomething();.

    }, false);

    reader.readAsDataURL(file);


  }

Answer 1

class FooClass {

    // just some method
    logResult(url: string) {
        console.log(url);
    }

    cprocList(file: Blob|File) {
        const reader = new FileReader();

        reader.addEventListener('load', () => {
            // use the variable reader from above
            // because FileReader stores result into the instance
            // of FileReader that attempts the read operation
            const readingOperationResult = reader.result;

            // since we used an arrow function, the
            // "this" is still the class
            this.logResult(readingOperationResult);

        }, false);

        reader.readAsDataURL(file);
    }
}

const foo = new FooClass();
const someBlobOrFile: Blob|File = undefined; // put your file here
foo.cprocList(someBlobOrFile); // should log the result

使用FileReader的实例访问结果。这也会释放this关键字以使用FooClass实例的上下文，以便this引用FooClass的实例。

此外，由于您使用的是TypeScript，因此最好提示您正在使用的变量和函数类型 - 这是TypeScript的优势。

Answer 2

Event.target是这样的：

ViewData["RaceId"] = new SelectList(_context.Set<Race>(), "RaceId", "RaceName", pigeon.RaceId);

访问回调内的JavaScript类成员

2 个答案: