Vue Array Prop Ошибка JSDoc TypeScript в коде VS: Типу 'ArrayConstructor' не хватает следующих свойств из типа 'MyCustomType []' - PullRequest
Новая
       49

Vue Array Prop Ошибка JSDoc TypeScript в коде VS: Типу 'ArrayConstructor' не хватает следующих свойств из типа 'MyCustomType []'

1 голос
/ 30 апреля 2019

Вдохновленный разделом «Проверка типов с помощью JSDoc» на « Почему я больше не использую TypeScript с React и почему вы можете захотеть переключиться слишком », я использую проект, созданный с помощью Vue CLI с ES6 но нет компиляции TypeScript или кода TypeScript.

Я включил параметр " Check JS " в коде Visual Studio, который позволяет вам проверять файлы JS типа, как если бы они были TypeScript. Проверка типа «включена» для кода Visual Studio с помощью комментариев JSDoc / @type. Я использую следующее, чтобы поместить мой код JS в отдельный файл из моего кода Vue: 

<script src="./MyComponent.js"></script>

Если я попытаюсь установить тип для массива для такого компонента, как этот: MyComponent.js 

 /**
 * @typedef {object} MyCustomType
 * @property {number} myNumberField
 */

export default {
  props: {
    /** @type {Array<MyCustomType>} */
    resultCards: Array
  }
};

Я получаю следующую проблему (подчеркнуты красным) в коде Visual Studio: 

Type 'ArrayConstructor' is missing the following properties 
from type 'MyCustomType[]': pop, push, concat, join, and 25 more.ts(2740)

Кто-нибудь знает решение для этого? Я хотел бы сохранить свой код как JavaScript, чтобы мне не нужно было конвертировать проект в TypeScript для проверки типов. Если решения не существует, я могу просто проигнорировать попытку установить типы для членов реквизита Vue.

См. Также: Microsoft / TypeScript: поддержка JSDoc в JavaScript

Редактировать: Если бы я использовал TypeScript с Vue, я думаю, что следующая ссылка будет иметь ответ: но я пытаюсь использовать простой JavaScript и JSDoc, а затем использовать проверки типов из VSCode.

из https://frontendsociety.com/using-a-typescript-interfaces-and-types-as-a-prop-type-in-vuejs-508ab3f83480

приведение объекта как функции, которая возвращает интерфейс, например: 

props: {   testProp: Object as () => { test: boolean } }

1 Ответ

0 голосов
/ 30 апреля 2019

Искал еще, и на этот раз я нашел ответ здесь: https://blog.usejournal.com/type-vue-without-typescript-b2b49210f0b

Мне нужно изменить мой фрагмент выше на: 

export default {
  props: {
    /** @type {{ new (): MyCustomType[] }} */
    resultCards: Array
  }
};

Другой синтаксис, который также работает (который мне нравится больше): 

export default {
  props: {
    /** @type {{ new (): Array<MyCustomType> }} */
    resultCards: Array
  }
};
...