Categories
Vue Answers

How to apply classes to Vue.js functional component from parent component?

Spread the love

Sometimes, we want to apply classes to Vue.js functional component from parent component.

In this article, we’ll look at how to apply classes to Vue.js functional component from parent component.

How to apply classes to Vue.js functional component from parent component?

To apply classes to Vue.js functional component from parent component, we can get the reactive property data from data.

For instance, we write

<template functional>
  <div :class="data.staticClass || ''" v-bind="data.attrs">...</div>
</template>

to get the class name from the data.staticClass property.

And then we set that as the value of :class to set that as the class name dynamically.

Conclusion

To apply classes to Vue.js functional component from parent component, we can get the reactive property data from data.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *