在VueJs模板中向属性添加字符

Question

So let say I have a class label-dog .

Let say I want to declare the class in a VueJs element like.

<img :class="type" >

With class of animal being something like

data: { type: dog }

How do I add the "label-" part to the class? Is there a syntax for this?

Answer 1

You can do it this way:

<img :class="'label-' + type" >

You can also define a computed property to 'build' your class:

computed: {
  fullClass() {
    return 'label-'+ this.type;
  }
},