Vue: как реализовать связывание загруженного svg с данными?

Question

[TerNik]

Доброго времени суток!
Подскажите, пожалуйста, как реализовать задачу.
Есть множество SVG-схем.
В модуле пользователь выбирает значение, при этом подгружается соответствующая схема.
После этого хочется сделать схему интерактивной.
Если бы мы сразу подгружали vue-модуль, то он выглядел бы так:

<svg>
	<g id='firstPartOfScheme'>
		<paht id='firstPath1' class='a lot of classes' :class='isSelected(1)' @click='onClick(1)'></path>
		<paht id='firstPath2' class='a lot of classes' :class='isSelected(2)' @click='onClick(2)'></path>
	</g>
	<g id='secondPartOfScheme'>
		<paht id='secondPath1' class='a lot of classes' :class='isPreview(1)'></path>
		<paht id='secondPath2' class='a lot of classes' :class='isPreview(2)'></path>
	</g>
</svg>

Но что делать, если у нас только голые схемы, как сделать их интерактивными?

Answer 1

[Павел Коковин]

Вам нужно сделать из них vue компоненты динамически. Есть небольшая статья, часть из которой может вам помочь: https://habr.com/ru/post/345814/