Dynamically change background color

[vinnyc]

Hi folks, is this possible if one is not using themes? I want to change the background colors of my left/right drawers:

 <q-drawer show-if-above v-model="left" side="left" bordered :content-style="{'background-color' : leftColor}">
            <!-- drawer content -->
        </q-drawer>

        <q-drawer show-if-above v-model="right" side="right" bordered :content-style="{'background-color' : rightColor}">
            <!-- drawer content -->
        </q-drawer>
    data: function () {
                return {
                    version: QMediaPlayer.version,
                    left: false,
                    right: false,
                    leftColor: "#000000",
                    rightColor: "#000000", 
...
    methods: {
    onTimeUpdate(currentTime, remaining) {
                axios.get("/color?time="+currentTime).then(function(response){
                    let data = response.data;
                    this.leftColor = data[0];
                    this.rightColor = data[1];

                });
            }

But the drawers are not updating (the http call is working as expected and I can see the variables changing but the components do not update. Is there a way to do this?

Thank you

[Ilia]

@vinnyc said in Dynamically change background color:

background-color

Can you change background-color to backgroundColor in style and see if that helps?

[vinnyc]

yep that helped also moved it to its own json object: leftStyle: {backgroundColor: '#000000'} and self.leftStyle.backgroundColor = data[0]; does the trick. Thank you