[Vuejs]-Best way toggle between three classes for an Element

by

3👍

✅

Use class bindings on #previewWrapper like this:

<div id="previewWrapper" :class="previewWrapperClass" />
...
data: {
  return {
     currentPreviewMode: null
  }
},
computed: {
   previewWrapperClass () {
     if (!this.currentPreviewMode) {
       return null
     }
     return {
        [this.currentPreviewMode]: true
     }
   }
},
methods: {
   toggleView(message){
        this.currentPreviewMode = message
   }
}

See Class and style bindings

Leave a comment