[Vuejs]-How to add class on vue.js 2?

by

4👍

✅

You don’t need to use jQuery for that.

<template>
    <span :class='{"rating": star !== null}'>
        ...
    </span>
</template>
<script>
    export default{
        props: {
            'star': null
        }
    }
</script>

:class is property binding syntax, you can say that it is now able to access the variables in your vue-component.

{'rating': star !== null} this simple boolean expression will ensure if .rating has to be added or not.

You can also do something like:

:class='{"rating": !!star}'

If the expression evaluates to a truthy, you will get the class applied.

👤Amresh Venugopal

Leave a comment