我把 2019 年的 bug。全部留在这里了


第一:you can not read the property 'tableid' of undifined,挖槽报的是组件内部错误,这个问题找的我要是死要活得,接下来我就来总结我的找错思路。


bug 回忆录(五)_java

bug 回忆录(五)_java_02

bug 回忆录(五)_java_03


结果是因为组件加了多了一个 \<slot></slot>插槽,一个组件有两个插槽,结果组件传递进来的东西不知道放在哪个插槽里面,所以就会报错了。

第二:can not read 'parentNode' of undefined



这种主要是因为你获取 parentNode 哪个DOM节点不存在,我这里原因是因为组件传递出来的 event 事件对象没传递对才导致这个错误。

第三:对象 key 设置了两次,这个确实要注意



第四:出现设置数据 {[object Object]: "Ken"}



第五:delete 的使用方法,当你需要删除数据的时候就需要用到this.$delete,注意与 原生js中 delete的区别



第六:注意 filter 的使用方式


bug 回忆录(五)_java_04


第七:注意change 事件与 click 事件不能同时使用,同时使用只会触发 change 事件,change 事件优先级高于 click 事件


bug 回忆录(五)_java_05


第八:change 默认传递值,你可能需要改造传递参数,你需要注意的问题


bug 回忆录(五)_java_06


第九:can not read checkbox 的 checked 属性时出错



第十:变量引用不对



第十一:变量未定义



第十二:重复代码注意要提取



第十三:scss 变量引用



第十四:v-if 与计算属性结合



第十五:注意 template v-slot 不能包 元素了



第十六:这种大概率是插件没导入



第十七:注意 for 循环 key 值问题



第十八:缺少逗号问题



第十九:标签没有闭合


bug 回忆录(五)_java_07


第二十:变量赋值要注意 深浅拷贝问题


bug 回忆录(五)_java_08


第二十一:我碰到的错误就是有对象赋值引起的深浅拷贝问题,直接修改到 vuex 数据


bug 回忆录(五)_java_09


第二十三:在使用 sortable.js 的时候,我们必须要注意 给 el-table 加上 row-key = "id",否则排序会混乱



第二十四:标签没有闭合



第二十六:注意字符串切割问题



第二十八:注意JSON出错问题



第二十九:注意vue watch 中不能用 箭头函数



第三十:注意浏览器每次发送请求之前会提前发送一个 OPTIONS 无请求返回



第三十一:注意 substr 与 substring的区别



第三十二:注意inject、provide


bug 回忆录(五)_java_10


第三十三:注意setTimeout与this.$nextTick()的区别


bug 回忆录(五)_java_11


第三十四:如果你想在其他组件使用另一个组件的 this 对象



第三十五:如何将对象的 key 用变量代替



第三十六:table中的 row-key = "id"重复出现问题



第三十七:如果你发现你的项目跑到一半卡在那里,一动不动的



第三十八:记得关注我的公众号哦



后面会持续更新的哦,欢迎点赞,关注

欢迎关注 我的 公众号 ‘志学Python’


https://link.zhihu.com/?target=http%3A//mp.weixin.qq.com/s%3F__biz%3DMzU2NTc1MTc5MQ%3D%3D%26mid%3D2247484150%26idx%3D1%26sn%3D4ed1c87959c159d00034e9c5f6a213d7%26chksm%3Dfcb7b876cbc03160d7f2af5579495476fddb533dbbf8aad355a6b3ca9d4287e7a09dc9f2e91a%23rdmp.weixin.qq.com




第三十九:watch 报错问题



第四十:prop 属性是不能直接修改的,好像 vue 是通过 vuex 保存这些属性的,直接修改是会报错的


第四十一:template v-slot can only appear at the root level inside the receiving the compoent


bug 回忆录(五)_java_12


第四十二:Error in updated hook: "TypeError: Cannot read property 'style' of null"


bug 回忆录(五)_java_13


第四十叁:Duplicate keys detected: '10' . thie may cause an update error



第四十五:



第四十六:注意深浅拷贝问题


bug 回忆录(五)_java_14


第四十七:如果出现 property or method "maxHeight" is not defined on the instance but referenced during render.....

这可能或许是电脑太卡了,编译之后没有及时更新到页面上,我之前碰到的问题就是这样,使劲调试,结果连created debugger 都没进去,当时即刻ctrl+c停掉控制台cmd,重新跑一便就好了,

如果不是上面这样的情况,可能是你直接修改了父级传递进来的 props 属性。


bug 回忆录(五)_java_15


第四十八:js如何将变量作为一个对象的key


bug 回忆录(五)_java_16


第四十九:组件没有安装


bug 回忆录(五)_java_17

bug 回忆录(五)_java_18


第五十:注意在使用 element-ui 的 infinite-scroll 组件的时候,记得给父级元素设置 overflow: auto; max-height: ,不然会一直触底加载


bug 回忆录(五)_java_19

bug 回忆录(五)_java_20


第五十一:vue.config.js "optimization" is not allowed

这种情况都是 API 写错地方,去看看webpack 教程吧


bug 回忆录(五)_java_21

bug 回忆录(五)_java_22


第五十二:webpack.optimize.UglifyPlugin has been removed, please use config.optimization.minimize instead


bug 回忆录(五)_java_23

bug 回忆录(五)_java_24


第五十三:注意 image-webpack-plugin 这个插件压缩图片质量的配置


bug 回忆录(五)_java_25

bug 回忆录(五)_java_26


第五十四:Vue-cli 打包报错


bug 回忆录(五)_java_27


第五十五:in vue.config.js : "mode" is not allowed



注意压缩代码插件 compressionOptions: {level: 9} ,中level的值配置


bug 回忆录(五)_java_28


变量重复声明


bug 回忆录(五)_java_29