Uncaught ReferenceError: is not defined at HTMLAnchorElement.onclick

Uncaught ReferenceError: is not defined at HTMLAnchorElement.onclick

昨天突然有个小朋友问我：“刘老师发生甚么事了？” 发了张截图给我，我一看，哦，源赖是左天，一个前端bug给我搞骨折了。

---

问题描述：

今天在用Vue.js写一个图片移入和点击效果时出现了以下错误：
Uncaught ReferenceError: is not defined at HTMLAnchorElement.onclick
说什么一个name未定义

---

原因分析以及解决：

1.首先我先想到的是js中，定义变量如果省略了var，会创建一个全局变量，有时会报ReferenceError错误,然后我去看报错的地方是我写的Vue代码，所以这个基本可以排除了 传统找bug要讲究化劲，四两拨千斤

var app = new Vue({ //显示错误的一行
	    el:"#body_a",
	    data:{			
	      isShow:false,	  
		  imgList: [
		    "../img/background_spotlight.jpg",
		    "../img/yinghua.jpg",
			"../img/background_spotlight.jpg",
			"../img/background_spotlight.jpg",
		  ],
		  index:0
	    },

2.我去搜了一下，网上说var，let，const三个关键字有区别，详情请见： https://blog.csdn.net/snsHL9db69ccu1aIKl9r/article/details/109554526

===========================
我也是Vue初学者，当时就觉得可能data里面定义了数组，而且要初始化变量，所以要用const来定义，于是我就改了。然后发现其实并没有任何影响。

3.然后我又看到一篇文章，说要把导入vue的script标签放在body外面 于是乎我就把该标签丢在了最底下。

===========================
结果方法啪一下就失效了，很快啊！一个死循环（127.0.0.1等待响应，某些文件加载不到），一个no defined（Vue no defined），我全部防出去了啊（又把它放到最前面去了）其实这时候传统找bug的点到位置，我已经输了。

4.结果最后我在删代码的时候发现我的图片的样式标签是这么写的

:style="{backgroundImage: 'url(' + imgList[index] + ')'}"

这时候我搞偷袭，不讲武德，我试了一下把imgList[index]加引号就好了。

:style="{backgroundImage: 'url(' + imgList[index] + ')'}"

---

希望找bug还是以和为贵，不要搞窝里斗，谢谢朋友们！