Блог

Главная - Вопросы по программированию - Веб-компоненты загружают неизвестный компонент

Веб-компоненты загружают неизвестный компонент

#javascript #html #web-component

#javascript #HTML #веб-компонент

Вопрос:

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

Итак, я написал тест (перед получением данных), в котором я тестирую возможность их динамической загрузки, и я не знаю точно, какой компонент загружать в данный момент времени:

До сих пор мне удалось выполнить динамический импорт:

   import(`${this.sdkbtnString}`);

Теперь я попробовал несколько методов для размещения тега, который я действительно не знаю, что такое раньше времени. Например, я попытался:

 <${this.sdkiconbtnString}></${this.sdkiconbtnString}>

Этот наивный подход не сработал.

Затем я попытался посмотреть, смогу ли я что-то получить от использования:

 const t = async import(`${this.sdkbtnString}`);

Однако я не могу использовать это ни для чего, поскольку оно просто возвращает определение модуля.

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

Комментарии:

1.Без особых раздумий: сохраните его в строке, затем проанализируйте с помощьюdeveloper.mozilla.org/en-US/docs/Web/API/DOMParser однажды вы ожидаете, что пользовательские элементы будут существовать. Если речь идет о значках SVG, взгляните на мой любимый проект <svg-icon> (более 5000 значков, работа продолжается)iconmeister.github.io

2. @Danny’365CSI’Engelman привет, приятель, спасибо за твой ответ. это приложение может работать, но что я могу сделать с событием или двусторонней привязкой данных?

3. С native вам придется разрабатывать все самостоятельно. Lit-Element Lit-HTML помогут с двусторонней привязкой. События, которые вам все равно придется реализовать самостоятельно. Выполнение всего с помощью событий (через общий родительский узел) является наиболее гибким подходом. Но я не уверен, что Lit вообще может обрабатывать ваш сценарий с неизвестными элементами… Я предпочитаю делать все с помощью native.

4. Возможно, это не связано. Этот JSFiddle (для меня) является основой компонентов и событий: jsfiddle.net/CustomElementsExamples/au25to79 (Запуск в Firefox, Chrome иногда жалуется на console.group )