How to put the assignment of classes into the method?

Question

Vue.js

There is a template:

<template>
  <div class="OfferTask">
    <div class="OfferTask__item" v-for="offerTask in OfferTask">
      <div class="OfferTask__title">{{ offerTask.advertiser.title }}</div>
      <div class="OfferTask__cutLines" v-for="cutLines in offerTask.cutLines">
        <div v-for="cutLine  in cutLines">
          <div class="OfferTask__progress-wrapper">
            <div class="OfferTask__progrerss-logo"></div>
            <div class="OfferTask__progress-item" :class="{'current-active' : (cutLine.progress.current > 0)}">
              <span> {{ cutLine.progress.current }}</span><span> /  {{ cutLine.progress.target }}</span></div>
            <progress class="sum" :max="cutLine.progress.target" :value="cutLine.progress.current"></progress>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

Depending on the value of the property, a class is assigned:

:class="{'current-active' : (cutLine.progress.current > 0)}"

But this is not very convenient, what is the best way to write a method?

Answer 1

methods: {
  classes: obj => ({
    'current-active': obj.progress.current > 0,
  }),
  ...
},

:class="classes(cutLine)"