Vue.js报错问题解决：[Vue warn]: Error in v-on handler: “ReferenceError: XXX is not defined“.

港控/mmm° 2023-09-26 20:16 12阅读 0赞

代码：

<div id="box">
        <button @click="counter">计算</button>
        <p>按钮被单击{
       {count}}次</p>
    </div>
    <script type="text/javascript">
        var vm = new Vue({
            el: '#box',
            data: {
                count: 0
            },
            methods: {
                counter: function () {
                    count++;
                }
            }
        })
    </script>

报错信息：

![59f5125dce254d768c804f79ce274eaf.jpeg][]

原因：count 忘加 this 了。。。

<div id="box">
        <button @click="counter">计算</button>
        <p>按钮被单击{
       {count}}次</p>
    </div>
    <script type="text/javascript">
        var vm = new Vue({
            el: '#box',
            data: {
                count: 0
            },
            methods: {
                counter: function () {
                    this.count++;
                }
            }
        })
    </script>

[1][]、[2][]

[59f5125dce254d768c804f79ce274eaf.jpeg]: https://img-blog.csdnimg.cn/59f5125dce254d768c804f79ce274eaf.jpeg
[1]: https://blog.csdn.net/yusdddd_/article/details/124139215?ops_request_misc=&request_id=&biz_id=102&utm_term=error%20in%20v-on%20handler:%20%22refere&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~sobaiduweb~default-2-124139215.blog_rank_default&spm=1018.2226.3001.4450
[2]: https://blog.csdn.net/qq_43430964/article/details/116376833?ops_request_misc=&request_id=&biz_id=102&utm_term=error%20in%20v-on%20handler:%20%22refere&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~sobaiduweb~default-3-116376833.blog_rank_default&spm=1018.2226.3001.4450