vue.js app.$destroy() does not remove app instance

Question

I am learning vue js. I have an app called growler. I am trying to call $destroy method on-click of button.

<button id="destroyButton" class="btn btn-danger" v-on:click="onDestroyClick">Destroy</button>

If I have method as part of Javascript event, it is working.

 <script type="text/javascript">
           document.getElementById('destroyButton').addEventListener('click', function() {
                growler.$destroy();
            }); 
</script>

But, if I call this method as part of vue on-click event, it is not working.

methods: {
                  onDestroyClick: function() {
                        this.$destroy();
                    } 
                }

I am having lifecycle hooks for different events of the instance. I am trying to log them in the console.

beforeDestroy: function() {
                    console.log('beforeDestroy');
                },

                destroyed: function() {
                    console.log('afterDestroy');
                }

This is working fine from Javascript Event listener. I am able to see Destroy messages in the console log.

Can you please tell, why it is not working as part of on-click event method. App instance is not destroyed.

Answer 1

Adding the answer here, as it was just mentioned in the comments.

It was a problem with bracces. The code is pasted below:

The corresponding jsfiddle is here

    var growler = new Vue({
                    el: '#growler',
                    data :
                    {
                     message : "test"
                    },

                    methods: {                   
                        onDestroyClick: function() {
                            this.$destroy();
                        } 
                    },
                   beforeDestroy: function() {
                       console.log('beforeDestroy');;
                    },

                    afterDestroy: function() {
                        console.log('afterDestroy');
                    } 
                    });