Как я могу остановить синтаксические ошибки типа «свойство не существует в типе JQuery» при использовании Typescript?

80

Я использую в своем приложении только одну строку jQuery:

$("div.printArea").printArea();

Но это дает мне ошибку Typescript:

Свойство printArea не существует для типа JQuery?

Может кто-нибудь сказать мне, как я могу остановить появление этой ошибки?

Алан2
источник

Ответы:

188

Вы можете преобразовать его <any>или расширить тип jquery, чтобы добавить свой собственный метод.

 (<any>$("div.printArea")).printArea();

// Или добавьте свои собственные методы (при условии, что это добавлено вами как часть настраиваемого плагина)

interface JQuery {
    printArea():void;
}
PSL
источник
дает мне:Error:(44, 23) TS2339: Property 'printArea' does not exist on type 'ElementFinder'.
user47376
Если вы попробуете этот interface JQueryспособ во внешнем модуле и определите параметр функции как тип JQuery и попытаетесь вызвать его из другого файла, TypeScript пожалуется, что есть два типа с именем JQuery, которые не связаны между собой.
Сэм Руби
Объявление интерфейса, похоже, отлично работает. Кроме того, его гораздо чище , чем литье в <любой> всюду
декодируется
У меня это не сработало, но в конце концов я наткнулся на stackoverflow.com/questions/30960386/… и понял, что мне нужно declare global { ... }объявление интерфейса.
Джеймс Хопкин
44

Думаю, это наиболее читаемое решение:

($("div.printArea") as any).printArea();
Эльдамир
источник
12

Вы можете транслировать его на

(<any>$('.selector') ).function();

Пример: инициализация выбора даты с использованием jquery

(<any>$('.datepicker') ).datepicker();
Вишну
источник
3

Для вашего примера вы бы добавили это:

interface JQuery{
    printArea():void;
}

Изменить: упс, ниже басарат правильный. Я не уверен, почему я думал, что он компилируется, но я обновил этот ответ.

AlexB
источник
Нет. Он оборачивает объект в $. Это больше не статичный $
basarat
Хм, ты уверен? Я протестировал это в проекте, и это сработало.
AlexB
Ага. Your case $.inviewport(el)Ops case$('selector').printArea
basarat
Извините, не хочу придраться, но мой код мне подходит. Кажется, вопрос заключается в том, чтобы код скомпилировался, поэтому если мой код компилируется, в чем проблема? Обратите внимание, мой второй пример с использованием printArea () также работает.
AlexB
$('selector').printAreaкомпилируется? Я так не думаю. $.printAreaбудет компилироваться. Вы были очень вежливы, так что никаких оскорблений не было сделано или умышленно :)
basarat
2

Поскольку printArea - это плагин jQuery, он не включен в jquery.d.ts.

Вам необходимо создать файл определения jquery.printArea.ts.

Если вы создаете полный файл определения для подключаемого модуля, вы можете отправить его в DefinficTyped .

Альбин Суннанбо
источник
И убедитесь, что ваш tsconfig.json тоже настроен правильно. Если он имеет параметр «типы», то будут распознаваться только перечисленные типы. Если нет, то он распознает все в node_modules / @ types
Дэн
2

Вы также можете написать это так:

let elem: any;
elem = $("div.printArea");
elem.printArea();
iqqmuT
источник
2

Вы также можете использовать синтаксис игнорирования вместо обозначения (или, лучше, «как любой»):

// @ts-ignore
$("div.printArea").printArea();
Гунтрам
источник