WordPress + Nuxt.js でポートフォリオサイトを作る その8

WordPressサイト（http://works.yuheijotaki.com/）の REST API と Nuxt.js でポートフォリオサイトを作成する。その8

GitHub: https://github.com/yuheijotaki/works-nuxt
Netlify: https://works-yuheijotaki.netlify.com/

dataで取得したカラーコードをcssネイティブ変数化

必要なところのみ

<template lang="pug">
  div(:style="customStyle")
</template>

<script>
export default {
  props:{
    'post': {
      type: Object,
      default: ''
    }
  },
  computed: {
    customStyle () {
      return {
        '--user-color': this.post.customColor
      }
    }
  }
}
</script>

<style lang="scss" scoped>
p {
  color: var(--user-color);
}
</style>

参考： Binding CSS Variables in Vue

もうちょいうまいやり方もありそうな気もしますが