Как предотвратить ошибку Vue "Неизвестный пользовательский элемент" для элементов HTML с пространством имен

Question

Я использую Vue в среде, где я должен выводить элементы пространства имен, скажем, например, <foo:aside>. Эти элементы в настоящее время даже не обрабатываются Vue (привязка значений к атрибутам, добавление обработчиков событий, ничего подобного), они просто присутствуют в шаблонах. Однако они могут содержать дочерние элементы, которые должны обрабатываться, и мой синтаксис содержит усы для отображения переменных и т. Д., Поэтому v-pre отключит их и, следовательно, не является решением для моего варианта использования.

Все работает нормально, но консоль залила со следующей ошибкой:

[Vue warn]: Unknown custom element: <foo:aside> - did you register the component correctly?
For recursive components, make sure to provide the "name" option.

Пространство имен определяется в корневом элементе с помощью xmlns:foo, но это не должно иметь никакого значения для Vue.

Есть ли способ предотвратить это, сказав Vue игнорировать элементы пространства имен или, по крайней мере, определив, какие пространства имен должны быть разрешены для обычных элементов HTML?

Answer 1

Благодаря связанному возможному дубликату (хотя я не согласен с тем, что это дубликат из-за применения ко всему пространству имен и требует работы дочерних элементов) и комментарием Silencesys, я получил следующее решение:

Vue.config.ignoredElements = [/^foo:/];

Начиная с Vue 2.5, вы можете использовать регулярные выражения для ignoredElements, и это идеальный способ игнорировать все пространство имен без необходимости добавлять каждое возможное имя тега, сохраняя при этом функциональность Vue для этих элементов.и их дочерние элементы.

Answer 2

Вы можете использовать v-pre, чтобы сказать vue, что элемент должен игнорироваться, проверьте vue.js api .

Например:

<foo:aside v-pre>