Laravel - VueJS 2 errors, Invalid Handler and Method undefined

I made a Vue component to edit and delete comments but I get 2 errors in my console for some reason, and the functions don't work either. The 2 errors I get are the following:

Property or method "destroy" is not defined on the instance but referenced during render.

And

Invalid handler for event "click": got undefined

I don't know what is causing this issue. The HTML where they get called is here,

<div class="card-body">
        <div v-if="bewerken">
            <div class="form-group">
                <textarea class="form-control" v-model="text" required></textarea>
            </div>

            <button class="btn btn-sm btn-primary" @click="update">Bewerken</button>
            <button class="btn btn-sm btn-link" @click="bewerken = false">Sluiten</button>
        </div>
        <div v-else v-text="text">
            {!! $reply->text !!}
        </div>
    </div>

@can('update', $reply)
    <button class="btn btn-sm btn-secondary ml-2" @click="bewerken = true">Bewerk</button>
    <button class="btn btn-sm btn-danger ml-2" @click="destroy">Verwijder</button>


@endcan

And the Reply.vue is this:

<script>
export default {

    props: ['attributes'],

    data() {
        return {
            bewerken: false,
            text: this.attributes.text
        };
    },

    methods: {
        update() {
            axios.patch('/replies/' + this.attributes.id, {
                text: this.text
            });

            this.bewerken = false;

            flash('Je reactie is bewerkt!');
        },

        destory() {
            axios.delete('/replies/' + this.attributes.id);

            $(this.$el).fadeOut(300, () => {
                flash('Je reactie is verwijderd!');
            });


        }
    }
}
</script>

Sorry for giving so little information, If any more is needed just say so. I'm not that great with Vue. Thanks in advance!

from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2zBodX2
via IFTTT