Cacher is the code snippet organizer for pro developers

// Custom directives
Vue.directive('gendercolor', {
    bind(el, binding, vnode) {
        if (binding.value === 'female') {
            el.style.backgroundColor = 'darkpink';
        } else {
            el.style.backgroundColor = 'royalblue';
        }
    },
});