VueJS TypeError cannot read property of

vuejs typeerror: cannot read property of undefined
[vue warn]: error in render: "typeerror: cannot read property of undefined"
vue cannot read property of null
cannot read property of undefined vuejs props
cannot read property 'title' of undefined vue
cannot read property '_wrapper' of undefined vue
v-model cannot read property of undefined
vue computed cannot read property of undefined

OK, so I haven't worked with Vue in probably over 2 years and I am giving myself a refresher. I feel really silly about asking such a simple question but I just can't figure out what I am doing wrong. I have a simple counter example where I am calling v-on:click(call my method). The method called counter simply does this.count++. I verified that the method works because I can call console.log or alert within it with no issues. But when I try to increment the counter it returns "Error in v-on handler: "TypeError: Cannot read property 'count' of undefined". My source code is as follows:

<template lang="pug">
    b-container(id="cont")
        b-button(v-on:click="counter") Click Me
        p {{count}}

</template>

<script>
    export default {
        data: () => {
            return {
                count: 0
            }        
        },
        methods: {
            counter: () => {
                this.count++
            }
        }
        
    }
</script>

<style>
#cont {
   margin-top: 10px
}
</style>

I think this has to do with the fact that you are using arrow functions to define your methods, so instead try this:

<script>
export default {
    data(){
        return {
            count: 0
        }        
    },
    methods: {
        counter(){
            this.count++
        }
    }

}
</script>

Because arrow functions are not bound to this, so this will be undefined inside of an arrow function.

Cannot read property of undefined - Get Help, in the console. What am I missing? [Vue warn]: Error in render: "TypeError: Cannot read property 'autoplay' of undefined" <template> <div cla… Stack Overflow Public questions and answers; Teams Private questions and answers for your team; Enterprise Private self-hosted questions and answers for your enterprise; Jobs Programming and related technical career opportunities

try this:

data() {
    return {
       count: 0
    }
}

e.g without making that a method.

vue: Uncaught TypeError: Cannot read property of undefined , Just use v-if on a common parent to all the elements in your template relying on that AJAX call, not around each one. So instead of something� Dismiss Join GitHub today. GitHub is home to over 50 million developers working together to host and review code, manage projects, and build software together.

If you are willing the use arrowed version, use like this:

data: () => {( counter: 0 )},

Otherwise refer to the previous answers =)

Cannot read property of listen of undefined � Issue #266 � vuejs/vue , What is actually happening? Uncaught TypeError: Cannot read property 'listen' of undefined at createRouter (vue-router.esm-bundler.js:2269) When developing locally, I often see the warning Uncaught TypeError: Cannot read property of undefined, but the HTML can be rendered successfully. However, the HTML can't be rendered when it's deployed to Netlify with npm run build command. So I have to treat this warning seriously.

Vue: TypeError: Cannot read property of undefined., My data works fine and populates the template, however I get warning: vue.js: 2215 TypeError: Cannot read property 'short_name' of undefined� TypeError: Cannot read property 'key' of undefined #5838. Closed If you have further need of support, I suggest to open a thread on forum.vuejs.org (I can help

[Vue warn]: Error in render: “TypeError: Cannot read property 'name , [Vue warn]: Error in render: “TypeError: Cannot read property 'name' of undefined ” when use deep object (3 levels). Posted 2 years ago by deryck. I get the error� VueJS & Firestore - Uncaught (in promise) TypeError: Cannot read property of undefined - ExceptionsHub.

[Vue warn]: Error in render: "TypeError: Cannot read property 'wp , I found a solution after I've read how vue works under the hood when the data are updated. My problem was that the Array.push() function was� Why GitHub? Features →. Code review; Project management; Integrations; Actions; Packages; Security