暑假去了一个企业进行前端实训,学的vue框架,结果遇到了超级多的问题。实训中的心酸真是一言难尽,所以写一篇博客记下来。
首先vue的格式非常严格,符号一定要正确,空格也要正确。我用的是win命令行窗口运行的node.js(npm run dev)什么的,一报错就超级恐怖(虽然大部分是警告)。
我主要记一下我出的错吧
-
Newline required at end of file but not found
啊哈哈哈哈,这个的解决方法超级简单的,只要在后再加一个空行就行了呢!因为它需要一个文件的结束符。 -
‘你定义的组件名’ is defined but never used
这个就是引入了组件但是没有把这个组件加入到components里面。 -
vue组件中CSS样式的问题
有一些父元素会使子元素的样式无效化。 -
在vue中使用querySelectorAll的时候要注意在mounted里调用这个函数,在此函数获取元素的时候,很可能DOM元素未被渲染。
-
@click如何绑定多个函数
在click绑定的函数中调用其他函数 this.otherFunction() -
npm报错ENOENT
呃,这个其实没有任何问题,只是要把路径跳转到项目路径中就行了 -
code EAUDITNOPJSON
这个问题是因为项目中没有package.json文件,可以npm init
然而事实上,我npm init之后项目中就会有两个package.json文件了,我在现实中的解决方法中是npm install(没错!我重新下载了一遍npm_moduel)然后一般这时候它会说我的文件存在很多高风险漏洞和一些中等风险漏洞,npm aduit fix就行了。 -
TypeError: Cannot read property ‘forEach’ of undefined
其实这个问题,我觉得非常奇怪。我原来传入forEach里的是一个写在data () {} 里的数组,然而当我把这部分放到json文件中再用v-for循环出来的时候就出现问题了。个人的猜测是:forEach在取到变量的时候,这个被得到的变量的内容其实还未传进来,或者传进来了但是长度为0,(好像我当时出现了一个轮播图的问题也是这个原因)所以只要在forEach外部加一个if判断就行了 if (this.YourArray) {this.YourArray.forEach(balbalbal…)} -
vue项目中使用better-scroll @click事件在移动端失效
这个是看别人的博客实现的,better-scroll会阻止touch事件。具体方法是在初始化的时候改一下配置就行了!
mounted(){
this.scroll=new Bscroll(this.$refs.wrapper, { mouseWheel: true, click: true, tap: true })
} -
关于vue格式的问题
平时在Format Document的时候我喜欢使用Beautify,直到有一天我也用这个格式化.vue文件。。。。。,命令行窗口报了40个问题!!!!!!