How to pass parameters in computed properties in Vue.js?

Sometimes, we want to pass parameters in computed properties in Vue.js.

In this article, we’ll look at how to pass parameters in computed properties in Vue.js.

How to pass parameters in computed properties in Vue.js?

To pass parameters in computed properties in Vue.js, we add a method.

For instance, we write

<template>
  <div>
    <span>{{ fullName("Hi") }}</span>
  </div>
</template>

<script>
export default {
  //...
  methods: {
    fullName(salut) {
      return `${salut} ${this.firstName} ${this.lastName}`;
    },
  },
};
</script>

to add the fullName method that takes the salut parameter and return a string combined with the firstName and lastName reactive properties.

Then we call fullname with 'Hi' to render the string returned by fullName.

Conclusion

To pass parameters in computed properties in Vue.js, we add a method.