Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How to merge two computed properties into one

Sorry for the noob question, but how do I combine the two computed properties, without duplicating the code? Thanks a lot

computed: {
        getStatusColor() {
            const { end_of_availability } = this.fullData
            if (end_of_availability === 'unlimited') {
                return 'w-green'
            } else {
                if (moment.utc().diff(end_of_availability + 'T23:59:59Z') < 0) return 'w-green'
                else return 'w-red'
            }
        },
        capitalizedAvailability() {
            const { end_of_availability } = this.fullData
            if (end_of_availability === 'unlimited') {
                return 'Active'
            } else {
                if(moment.utc().diff(end_of_availability + 'T23:59:59Z') < 0) return 'Active'
                else return 'Inactive'
            }
        }
    } 

>Solution :

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

What you seem to be interested in is knowing if your thing is active or not, so create a computed property that calculates if your thing is active, and return whatever you need to return based on that.

computed: {
  isActive() {
    const { end_of_availability } = this.fullData;
    return (
      end_of_availability === 'unlimited' ||
      moment.utc().diff(end_of_availability + 'T23:59:59Z') < 0
    );
  },

  statusColor() {
    return this.isActive ? 'w-green' : 'w-red';
  },
  capitalizedAvailability() {
    return this.isActive ? 'Active' : 'Inactive';
  }
}

Also, name your computed properties as if they are properties, not as if they are methods. getStatusColor is not a property of a thing. The corresponding property would be statusColor.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading