# Vue components

Creating components can sometimes be verbose. Here are some useful methods to handle meta patterns when creating components.

# bemModifiers

Returns Array with class generator for vue with BEM Semantics

• Returns:[ bockOrElementDefiniton: String, { ...modifiers: Boolean }]

• Example:

Vue.use(Vuetils);

export default {
  name: "DumbComponent",
  data() {
    return {
        visible: true,
        primary: false,
    }
  }
};

<template>
    <div :class="$bemModifiers('block', { visible })">
        <h1 :class="$bemModifiers('block__element', { primary })"></h1>
    </div>
</template>