Assignment 10

App.vue

<template>
    <div class="container">
        <div class="row">
            <div class="col-xs-12 col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-3">
                <h1>Directives Exercise</h1>
                <div v-my-on:click="doAlert">I dare you to try clicking this text!</div>
                <input v-my-on:keyup="doInputAlert">
            </div>
        </div>
    </div>
</template>

<script>
export default {
    methods: {
        doAlert() {
            alert('something happened!');
        },
        doInputAlert() {
            alert('something typed into <input>!');
        }
    },
    directives: {
        'my-on': {
            bind(el, binding, vnode) {
                switch(binding.arg) {
                    case 'click':
                        el.onclick = binding.value;
                    break;
                    case 'keyup':
                        el.onkeyup = binding.value;
                    break;
                }
            },
        },
    },
}
</script>