Typescript: Permintaan untuk mengubah currentTarget di antarmuka Peristiwa untuk lib.d.ts

Dibuat pada 29 Jul 2014  ·  36Komentar  ·  Sumber: microsoft/TypeScript

Saat menggunakan antarmuka Peristiwa dari lib.d.ts, dan memasang pemroses, callback akan mendapatkan objek berjenis Peristiwa. Namun, properti currentTarget Acara berjenis EventTarget (padahal seharusnya bertipe Element / HTMLElement).

lib.d.ts Suggestion help wanted

Komentar yang paling membantu

Saya menemukan TS2339: Property 'result' does not exist on type 'EventTarget' di JS FileReader onload , dan peringatan lain untuk getSummary() pada acara yang diteruskan ke FileReader onerror .

Pekerjaan saya, untuk menekan garis merah berlekuk-lekuk yang mengerikan ;-) adalah sebagai berikut:

interface FileReaderEventTarget extends EventTarget {
    result:string
}

interface FileReaderEvent extends Event {
    target: FileReaderEventTarget;
    getMessage():string;
}

Kemudian di aplikasi saya:

reader.onload = function(fre:FileReaderEvent) {
        var data = JSON.parse(fre.target.result);
        ...
    }

Kode JS yang dihasilkan terlihat bagus dan berfungsi untuk saya. Bisakah solusi semacam ini, untuk jenis peristiwa JS yang tidak biasa, ditambahkan ke lib.d.ts?

Saya menduga solusi saya terlalu sederhana. Tetapi akan membantu untuk mengetahui mengapa.

Semua 36 komentar

Objek XMLHttpRequest juga bisa berupa currentTarget tetapi bukan Element / HTMLElement. Mungkin itulah alasan dibalik ini. Akankah tipe generik memperbaiki ini?

interface Event<T extends EventTarget> {
    /* ... */
    currentTarget: T;
    /* ... */
}

interface EventListener<T extends EventTarget> {
    (evt: Event<T>): void;
}

interface HTMLElement {
    /* ... */
    addEventListener(type: string, listener: EventListener<HTMLElement>, useCapture?: boolean): void;
}

Sepertinya itu akan sangat membantu untuk memperbaikinya.

dikirim dari iPhone saya

Pada 3 Agustus 2014, pukul 13:34, SaschaNaz [email protected] menulis:

Objek XMLHttpRequest juga bisa berupa currentTarget tetapi bukan Element / HTMLElement. Mungkin itulah alasan dibalik ini. Akankah tipe generik memperbaiki ini?

acara antarmuka{
/ * ... _ /
currentTarget: T;
/ _ ... * /
}

antarmuka EventListener{
(evt: Acara): kosong;
}

antarmuka HTMLElement {
/ * ... * /
addEventListener (type: string, listener: EventListener, useCapture ?: boolean): void;
}
-
Balas email ini secara langsung atau lihat di GitHub.

Perhatikan bahwa tidak semua target acara adalah Element (http://www.w3.org/TR/DOM-Level-3-Events/#event-types), jadi solusi di sini harus lebih banyak sejalan dengan saran @SaschaNaz .

Masalahnya adalah saat ini kami membuat lib.d.ts, menggunakan skrip, berdasarkan file yang tidak dapat kami publikasikan saat ini, dan file tersebut sudah tidak digunakan lagi untuk mendukung yang baru. Oleh karena itu, kami tidak akan melakukan perbaikan pada skrip kali ini, tetapi semoga kedepannya kami dapat mengambil PR pada skrip / input generasi lib.d.ts.

Menandai 'Revisit' untuk saat ini - silakan hubungi kami dalam sebulan dan saya dapat melihat di mana kami berada.

Apakah ada sintaks untuk merujuk tipe saat ini? Saya pikir ini bisa diselesaikan dengan lebih mudah jika kita bisa melakukan pekerjaan seperti ini:

interface HTMLElement {
    addEventListener(type: string, listener: EventListener<this>, useCapture?: boolean): void;
}

var image: HTMLImageElement;
var video: HTMLVideoElement;
image.addEventListener // receives EventListener<HTMLImageElement> type
video.addEventListener // receives EventListener<HTMLVideoElement> type

Fungsionalitas itu tidak ada, ini mirip dengan yang disarankan di # 285 dan # 229

Halo semuanya, melakukan ping ke utas ini. Saya mengalami masalah ini dengan Event.target . Saya membayangkan sebagian besar waktu target adalah HTMLElement . Agak aneh bahwa tipe default menganggapnya bukan. Saya mencoba saran @SaschaNaz dan mengalami masalah "pengenal duplikat" (maaf saya mungkin melewatkan sesuatu, saya cukup baru mengenal TypeScript).

Sunting: ini bekerja untuk menghilangkan peringatan: (<HTMLElement>event.target).tagName

@rayshan sarannya adalah untuk apa yang harus dimasukkan ke dalam file lib.d.ts dan file tersebut dibuat secara otomatis berdasarkan langsung pada implementasi Internet Explorer. Jadi kesalahan yang Anda temui akurat. Saat ini satu-satunya cara untuk mengatasinya adalah dengan membangun tanpa built in lib ( --noLib ) dan menggunakan penyelesaiannya, atau melakukan apa yang telah Anda lakukan, yang memberikan target. Saat ini ada sejumlah tantangan dalam menangani jenis kembalian DOM sekarang di TypeScript (sebagian besar karena DOM bukanlah kumpulan API yang paling konsisten / terstruktur / jenis aman / yang diterapkan secara konsisten).

Sekarang setelah # 4910 digabungkan, dapatkah ini ditinjau kembali?

@zhengbli mungkin memiliki beberapa konteks tentang status lib.d.ts masalah yang memerlukan pembuatan berbasis skrip

Humas disambut. berikut ini beberapa informasi tentang berkontribusi pada perubahan lib.d.ts: https://github.com/Microsoft/TypeScript/blob/master/CONTRIBUTING.md#contributing -libdts-fixes

Saya menemukan TS2339: Property 'result' does not exist on type 'EventTarget' di JS FileReader onload , dan peringatan lain untuk getSummary() pada acara yang diteruskan ke FileReader onerror .

Pekerjaan saya, untuk menekan garis merah berlekuk-lekuk yang mengerikan ;-) adalah sebagai berikut:

interface FileReaderEventTarget extends EventTarget {
    result:string
}

interface FileReaderEvent extends Event {
    target: FileReaderEventTarget;
    getMessage():string;
}

Kemudian di aplikasi saya:

reader.onload = function(fre:FileReaderEvent) {
        var data = JSON.parse(fre.target.result);
        ...
    }

Kode JS yang dihasilkan terlihat bagus dan berfungsi untuk saya. Bisakah solusi semacam ini, untuk jenis peristiwa JS yang tidak biasa, ditambahkan ke lib.d.ts?

Saya menduga solusi saya terlalu sederhana. Tetapi akan membantu untuk mengetahui mengapa.

Saya ingin memperbaiki masalah ini. Tapi seperti yang saya lihat, satu-satunya referensi ke currentTarget ada di dalam file webworker.generated.d.ts yang dihasilkan di generator TSJS. Saya tidak tahu bagaimana cara memperbaikinya 😞
Saya sangat berharap seseorang dapat memperbaiki masalah yang hampir 3 tahun ini. Error seperti itu mungkin menjadi alasan mengapa saya sering mendengar orang mengatakan bahwa TypeScript sulit digunakan dan itu sangat membuat saya sedih.

Baik. Saya mencoba untuk mulai menyelesaikan masalah ini. Saya membuat PR https://github.com/Microsoft/TSJS-lib-generator/pull/202
Semoga ini mengarah ke arah yang benar.

Saya mendapatkan Property 'getBoundingClientRect' does not exist on type 'EventTarget'. . Saya pikir ini adalah ide yang bagus.

Nah, PR tersebut tertunda sejak hampir 2 bulan. Saya akan memeriksa ini jika ada yang bisa dilakukan untuk mempercepat ini.

Akan sangat bagus jika kita dapat memiliki currentTarget menjadi generik, sehingga misalnya HTMLInputElement.onchange dapat menjadi tipe (event: Event<HTMLInputElement>) => void sehingga event.currentTarget.value berfungsi tanpa pemeran apa pun atau ketik anotasi. Pengetikan untuk React melakukan ini, tapi sayangnya dom.lib.d.ts tidak.

Ini diblokir oleh masalah kinerja yang disebabkan oleh obat generik karena memperkenalkan obat generik menggandakan penggunaan memori 😭

Apakah masalah kinerja ini berlaku sama untuk pengetikan React?

lib.d.ts tidak menyertakan pengetikan React tetapi Anda dapat mengujinya dengan menambahkan --diagnostics ke perintah.

@felixfbecker Saya pribadi ragu apakah ini akan segera diperbaiki. Saya kira kebanyakan orang sudah membuat solusi mereka atau meninggalkan TypeScript. Itu juga mengapa hanya ada sedikit orang yang mengalami masalah ini.

Masalah ini masih ada di Versi 1.18.0 (1.18.0)

Halo,

Masalah yang sama dengan ... dan saya rasa itu belum diperbaiki.

ketika saya menandai proyek angular 4 saya untuk produksi, kemudian masalah muncul, yang lain, sementara saya hanya menggunakan ng serve .. ini berfungsi dengan baik. Jadi saya rasa ada sesuatu yang berhubungan dengan bagaimana sudut mengelola file produksi.

Semoga kemajuan dalam masalah ini. Sulit untuk memanipulasi dom dengan Typecript.

Masalah ini sudah empat tahun dan PR terkait hampir satu tahun saya ragu ini akan diperbaiki dalam waktu dekat.

Masalah ini sudah ada selama 4 tahun tetapi belum diperbaiki.

Ada perbaikan yang tersedia di https://github.com/Microsoft/TSJS-lib-generator/pull/207
Tapi @saschanaz memblokir berdasarkan kinerja.

Casting party tonite di 11 - bongkar tab browser Anda:
confirmationMessage(event: BeforeUnloadEvent): any {
const activeElement: HTMLElement = <HTMLElement>(<Document>event.target).activeElement;

: dancing_men:

Bagaimana menambahkan

    readonly currentTarget: Element | null;
    readonly target: Element | null;

hanya pada UIEvent ? Ini tidak terlalu spesifik, tetapi membuat sebagian besar kode senang.
Mungkin bahkan tanpa | null seperti pada UIEvent, keduanya selalu disetel

masalah yang sama di sini. Saya mencoba menggunakan Vue dengan Typecript dan ingin mendapatkan nilai dari sebuah input field saat pengguna mengetik. Tetapi event.target.value tidak akan meneruskan pemeriksa tipe meskipun - menurut saya - inout teks harus selalu menghasilkan bidang seperti itu untuk acara semacam itu

Kami menghilangkan kesalahan dengan menambahkan tipe any ke kode kami:

this.url = (<any>event).target.result;

Bagaimana dengan mengetik Event dan EventTarget?

interface Event<C = any, S = any, T = any> {
  ...
  currentTarget: EventTarget<C> | null;
  srcElement: EventTarget<S> | null;
  target: EventTarget<T> | null;
  ...
}

interface EventTarget<T = any> {
  ...
}

Saya mengalami masalah ini saat menggunakan FileReader, cast sederhana ke jenis yang benar akan memperbaikinya

const fileReader = new FileReader();
fileReader.onload = $ev => {
  console.log($ev); // type ProgressEvent
  console.log($ev.target); // type FileReader
  // console.log($ev.target.result); // editor and autocomplete doesn't show any error
  console.log(($ev.target as FileReader).result); // casting compiles fine
};
fileReader.readAsText(file);

Apakah ada pembaruan tentang topik ini? Akan berguna untuk memilikinya tanpa memaksa casting event.target setiap kali atau acara casting apa pun (seperti yang dilakukan @gautamkrishnar di atas). Juga buka sejak 2014. Terima kasih!

Memang, alangkah baiknya dengan tanggapan resmi untuk masalah ini sebelum ulang tahunnya yang ke-6

Ya, ini mungkin gangguan nomor 1 sepanjang hari saat bekerja dengan DOM, JSX, dll.

Faktanya, itu satu-satunya gangguan harian yang saya alami - dan saya membayangkan jutaan orang mengalami ini, sepanjang hari.

Sangat sulit untuk memahami mengapa ini tidak mendapat prioritas apa pun.

Sama untuk event.target. Skenario yang sangat umum adalah menambahkan handler klik ke elemen induk saat anak belum ada, dan saat akan ada banyak anak. Pengujian sederhana untuk event.target.tagName atau bahkan classList adalah hal umum yang saya lakukan. Berhasil .... telah menggunakannya selama bertahun-tahun. Saya tidak mendapatkan intellisense untuk tagName / classList karena EventTarget tidak diklasifikasikan sebagai HTMLElement, tetapi berfungsi.

Apakah halaman ini membantu?
0 / 5 - 0 peringkat