【Vue3.2】styleタグ内でJavaScript変数をバインドできる

Vue.js3.2からは、JavaScriptの変数をCSS変数としてバインドできるようになりました。 つまりは、CSSの値を動的に設定できるということです。 ものは試しのやってみましょう。 <script setup lang="ts"> import { ref } from "@vue/reactivity"; const color = ref("#000000"); </script> <template> <h1 class="title">タイトル</h1> <input type="color" v-model="color" /> </template> <style> .title { color: v-bind(color); } </style> <script>タグ内で宣言したcolorという変数を<style>タグ内でv-bind(color);として使用してい