1

While I know how to dynamically bind styles I did not find a way to change the style of an element once it is mounted.

As an example, for the component

<template>
  <div>
    <another-component></another-component>
  </div>
</template>

<style>
  .class-defined-in-another-component {
    color: blue;
  }
</style>

is it possible to change color to red in <style>?

Note: I am specifically interested in modifying the style and not using a construction such as <span :class="{color: dynamicColor}">, where dynamicColor would be a computed value. This is because this modified style will actually be applied to downstream components (<another-component> in the example above).

tony19
  • 125,647
  • 18
  • 229
  • 307
WoJ
  • 27,165
  • 48
  • 180
  • 345
  • What you try to achieve is to modify the CSS at runtime. Have a look here at some solutions: https://stackoverflow.com/questions/6998993/change-css-rule-at-runtime. Vue.JS itself does not provide any special functionality for this. – cello Nov 09 '17 at 20:56
  • You can have two CSS classes and just change them. What you are trying to do is not possible. It would mean chaning your code. – Peter Matisko Nov 09 '17 at 22:40

0 Answers0