Сводка
Я пытаюсь выяснить, как сделать фрагмент HTML с заголовком ATTRIBUTE (intellisense).У нас есть веб-компонент, и все теги и атрибуты, связанные с тегами, задокументированы.Как проще всего это реализовать?
Пример
У нас есть тег верхнего уровня zing-grid.Этот тег имеет много атрибутов.В следующем примере я хочу typeahead для атрибута caption.Атрибут caption должен появляться ТОЛЬКО, когда у меня есть префикс <zing-grid.
Эта проблема похожа на Как вставить фрагмент атрибута html в jsx в vscode .В этом примере div имеет class intellisense.В этом случае я хочу использовать ту же реализацию typeahead в моем настраиваемом веб-компоненте для атрибута caption.
Текущий синтаксис POC-фрагмента
Как убедиться, что атрибут caption ТОЛЬКО фиксируется в zing-grid tag
vue.code-snippets file
{
"zing-grid": {
"prefix": "<zing-grid",
"body": [
"<zing-grid \n\t$0></zing-grid>"
],
"description": "ZingGrid top level tag"
},
"zing-grid-caption": {
"prefix": "<zing-grid ",
"body": [
"<zing-grid \n\t caption=\"$1\"></zing-grid>"
],
"description": "Displays a grid with the caption attribute on the grid"
},
"caption": {
"prefix": "caption",
"body": [
"caption=\"Hello World\""
],
"description": "Displays a grid with the caption attribute on the grid"
}
}
Пример вывода
Следующий пример вывода взят из нашей собственной реализации редактора кода,В идеале нам бы хотелось, чтобы эта поддержка визуального студийного кода была гораздо более мощной и полной IDE.
Запись экрана облачного приложения
- Еще одна ссылка, так как она создает проблемы при публикации ссылок https://duaw26jehqd4r.cloudfront.net/items/0E431n0Q1m261T3S1T03/Screen%20Recording%202019-02-07%20at%2003.35%20PM.mov?X-CloudApp-Visitor-Id=2965229