【Vue.js】CSSを動的に出力する方法

はじめに

以前v-htmlを用いて動的にHtmlを出力していましたが、今回はCSSを動的に出力する内容に関する備忘録です。

※以前Htmlを動的に出力していた記事は以下です。

【Vue.js】v-htmlディレクティブを用いてHtmlを出力する。 - おーみんブログ

サンプルコード

以下にサンプルコードを記載します。
内容としては単純で、Vueインスタンス生成時(created)にheadタグの最後にCSSを追加しているだけです。

<script>
export default {
    created() {
      document.head.insertAdjacentHTML('beforeEnd', `<style>${/* 任意のCSS */}</style>`);
    }
}
</script>

おわりに

以上、Vue.jsでCSSを動的に出力する方法でした。