写在前面的
世事难料,刚刚接触VUE,自己的脑海中还是总带着“页面JS解决一切”的想法。虽然知道外挂JS并不符合整个VUE的思想,但是还是得这么做了。
因为项目原因,我们必须使用Iview.js,因为其本身对页面表格的功能封装的比较完善,所以想要自己再按照需求自定义一些样式或者功能,就比较麻烦了。对于样式而言,修改起来比较容易,我们只需要找到项目文件目录下node_modules–>iview–>dist–>style中的iview.css,修改源文件中的一些小样式即可。但是,对于再增加或者优化一些功能,就不能像这样去修改源文件了。(简单的小功能还可以,复杂一点的……走好不送)
两种方法
方法一
- 我们在脚本中的”mounted(){}”下,使用dom进行script的挂载。(mounted与created的区别百度即可vue社区给的解释还是很不错的)
mounted(){
const s = document.createElement('script');
s.type = 'text/javascript';
s.src='../../test.js';
document.body.appendChild(s);
}
/*这样我们在整个页面加载之后,会将test.js挂载到页面上,使用created的话,就需要考虑JS中的函数和页面加载的先后顺序了,具体按照自己的需求即可*/
方法二
mounted(){
const s = document.createElement('script');
s.type = 'text/javascript';
s.onload='.........'
document.body.appendChild(s);
}
/*我们可以在onload中直接写js,但是这样一来就需要考虑到底是在mounted中外挂,还是在created外挂,到底是使用onload还是ready,就需要自己斟酌了,否则页面加载的时候会报错*/
总结
总之,非常不建议自行添加JS,所有的外挂行为均可以由VUE本身去实现,但是自己水平有限,对VUE的掌握还是不到位,所以算是偷了个懒吧,罪过罪过~