VueJS-добавить стиль css с помощью v-html
Я хотел бы добавить html-контент из базы данных (чтобы часть содержимого страницы можно было изменить извне).
Как добавить стиль SCSS? Я использую v-html, как это, но я понятия не имею, как добавить стиль:
<div v-html="ct"></div>
async created() {
this.ct = await this.getPage("blabla");
}
Я бы предпочел не добавлять часть SCSS в стиль vuejs, и у меня уже есть некоторые другие CSS для другой части кода, но при необходимости стиль может быть определен в этих активах
<style lang="scss" scoped>
@import '~assets/styles/core';
</style>
Я нашел несколько ответов, но не похоже, что стиль исходит из другого источника Стиль Vue.js в формате HTML с прицелом для CSS или Добавить CSS стиль в формате HTML
Ответы - VueJS-добавить стиль css с помощью v-html / VueJS - add css style with v-html
25.09.2020 05:51:02
При использовании CSS с областью видимости Vue создает динамически генерируемые селекторы для ссылок на элементы. Однако содержимое v-html не получает динамически генерируемых селекторов, потому что Vue не динамически создает этот HTML-код, а просто сбрасывает его. Поэтому, если вы используете v-html, стили области видимости, определенные в Родительском компоненте(компонентах), не будут применяться к дочерним компонентам без использования глубоких селекторов.
Вам нужно либо сохранить свои стили глобальными, импортировать таблицу стилей через конфигурацию Webpack, чтобы имена классов не изменялись Vue в соответствии с динамическими селекторами экземпляров Vue, либо взять стили, специфичные для дочерних элементов v-html, и переписать их для использования глубоких селекторов.