[Vuejs]-How to pass css module generated classes to components in Vue

by

0👍

You can assign class to a component using v-bind if they are coming from a variable

<div :class="list_view === 'list' ? 'at-listview' : 'at-groupview'"></div>

In above example list_view is a variable

If you want to send these classes to any component, again the concept is same but this time sending classes in a prop

<child-component classes_to_send="class1 class2 class" />

OR (using colon : to bind a variable )

<child-component :classes_to_send="class_from_variable" />

Now you can get these classes in <child-component/> props as shown below:

<script>
   ...
   export default:{
      props:['classes_to_send'],
   }


   ...
</script>
<template>
   <div :class="classes_to_send"></div>
</template>

Leave a comment