0

I want to change font(text) color when user pick it from color picker,I had made this but it wont work,

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

Image of what I want to achieve when user select color

Improve this question
1
  • Your changing the color value of the property color. Yet you do not assign the color to the textarea nor change the class changeColor. You have a bit of a mix up there. Can you please share the complete code of your component ? Commented Feb 11, 2020 at 8:35

1 Answer 1

Reset to default
1

To dynamically assign a css color value to a html element you can use :style="{}" . Like this 

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

<script>
  export default {
    data() {
      return {
        color : '#FFFFFF'
      }
    }
  } 
</script>
Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Awesome @ObossChacha ! Glad I could help :)=

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.