vue.js - 在 Vue js 中使用颜色选择器更改字体（文本）颜色

Question

当用户从颜色选择器中选择它时，我想更改字体（文本）颜色，我做了这个，但它不起作用，

<textarea :class="changeColor"></textarea>
<v-color-picker class="ma-2" hide-inputs @click="changeColor('color')"></v-color-picker>
 changeColor(val){ this.color = val}

标签： vue.js

Answer 1

要将 css 颜色值动态分配给 html 元素，您可以使用:style="{}". 像这样

<template>
<div>
   <textarea :style="{color:color}"></textarea>
   <v-color-picker v-model="color" />
</div>
</template>

<script>
  export default {
    data() {
      return {
        color : '#FFFFFF'
      }
    }
  } 
</script>