Рубрики
Без рубрики

Шаблон буквальных выражений в рамках тега шаблона кажется упущенной возможностью

Шаблонные литералы удивительны, но в последнее время я обнаружил, что они заставляют все выглядеть как общеизвестный гвоздь … Tagged с обсуждением, JavaScript, Templating, Patterns.

Шаблонные литералы удивительны, но в последнее время я обнаружил, что они заставляют все выглядеть как общеизвестный гвоздь, особенно когда дело доходит до динамического обновления больших блоков HTML.

Я все еще работаю в среде, которая в основном является бэкэнд, где Perl генерирует HTML из шаблонов, поверх которых мы добавляем постепенно улучшенные компоненты JavaScript.

Когда ваш задний и передний конец необходимо иметь возможность генерировать общие шаблоны пользовательского интерфейса на основе библиотеки шаблонов, становится разочаровывающим, необходимо определить источник HTML для каждого шаблона пользовательского интерфейса в нескольких местах (один раз в Perl, один раз в JS).

<Шаблон> Тег может быть полезен. Бэкэнд может генерировать HTML, необходимый для компонента (например, каждый элемент TODO в списке TODO), а JS может использовать этот шаблон HTML для генерации каждого нового элемента TODO.

Но единственный способ динамического вставки значений в этот шаблон, о котором я знаю, – это чрезвычайно неуклюжие использование селекторов CSS в содержании шаблона. (См.: https://blog.teamtreehouse.com/creating-reusable-markup-with-the-html-template-element )

Разве это не имеет гораздо большего смысла, теперь литералы шаблонов находятся в каждом крупном браузере, чтобы добавить поддержку в рамках <Шаблон> API для выражений? например


const tmpl = document.getElementById('test-template');

// where "MAGIC" is some means of supplying data as json 
document.body.appendChild(tmpl.content.cloneNode(true, MAGIC));

Веб -компоненты имеют Система, но это требует принятия гораздо большей технологии. И, да, всегда есть усы/руль и др., Но опять же, это добавляет к полезной нагрузке JS. Да, мы также используем React, но обновление всего, чтобы отреагировать, не всегда возможно.

Я один, пытаясь сделать эту работу? Кто-нибудь нашел для этого решение без фреймворта или фреймворк-литовую линию?

Оригинал: “https://dev.to/davecranwell/template-literals-within-the-template-tag-seem-like-a-missed-opportunity-1deh”