入职第一个项目bug总结-2018/07/28
2024-08-25 05:14:13
此项目是正式入职后的第一个项目,可能各种原因重重,导致测试提出了如此多的bug,关于那些因为需求不清楚而导致的就不说了,bug总结如下:
一、ElementUI table组件出现横向滚动条
原因:因为左右的横向border导致浏览器计算的宽度超出了我们设定的宽度,从而导致出现横向滚动条
解决:
方法一:去掉border,但是会影响样式美观
方法二: .el-table__body-wrapper, .el-table__footer-wrapper, .el-table__header-wrapper { width: 101%; }
二、文件单位转换byte字节转化我对应单位(四舍五入取整计算)
function bytesToSize(bytes) {
if (bytes === 0) return '0 B';
var k = 1024, // or 1000
sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
i = Math.floor(Math.log(bytes) / Math.log(k));
return (bytes / Math.pow(k, i)).toFixed(0) + '' + sizes[i];
}
三、ElementUI 组件如果没有提供自定义class,修改样式可以通过审查元素获取对应的默认类名来修改覆盖组件样式,但是这个样式要写到全局,放到vue的组件自己作用于样式不会有效,因为自己组件作用域的css选择器打包时会被增加属性,进而限制其为局部的
四、vue重新渲染的问题
组件中data的某个值orderList为一个数组或者一个对象,其内各项为一个个对象,然后我们动态通过等号方式添加一个新对象
this.dataList[prop] = {
status: 0
}
然后我们以为需求需要修改新添加对象的属性
this.orerList[prop].status = 1
但是我们会发现修改后组件并没有重新渲染
原因:因为这个新添加的对象是通过等号添加的,这个新添加的对象并没有参与过初始化,也就并没有设置setter和getter拦截器,所以这个新添加的对象是非响应式,所以我们改变该对象, 并不会触发重新渲染。
解决:通过Vue.$set(obj, prop, val)来添加,通过此方法添加的数据是响应式的
this.$set(this.dataList, prop, {
status: 0
})
--------------
最新文章
- 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别
- VUE 入门基础(5)
- WinForm 实现登录,验证成功,关闭登录界面,显示主界面
- WPF 视图分组排序
- 全栈project师?给把瑞士军刀你去砍鬼子好不好!?
- QT-Creator C/C++ 打地鼠小游戏
- 基于socket实现的简单的聊天程序
- SQL Server常用函数使用方法(学习)
- goroutine 和 线程的区别
- db2 报错 sqlcode=-420 自动类型转换的问题
- 牛客小白月赛12 H(dfs序+线段树),F(分块思想+bit),J(二分)
- [20171120]关于INBOUND_CONNECT_TIMEOUT设置.txt
- Spark集群之yarn提交作业优化案例
- 仿win10环境变量助手
- 115. Distinct Subsequences (String; DP)
- elasticsearch 5.x Delete By Query API(根据条件删除)
- win7 mtp
- 虚拟机与Linux
- 【Linux】touch命令
- vue学习笔记(一)
热门文章
- 从以下哪一个选项中可以获得Servlet的初始化参数。
- ubuntu终端使用代理
- <;input>;type类型
- Django model :add a non-nullable field &#39;SKU&#39; to product without a default; we can&#39;t do that
- java-web 过滤器 &;amp; 监听器 &;amp; 拦截器
- Android开发:《Gradle Recipes for Android》阅读笔记(翻译)6.1——推荐配置
- iOS 下载
- [Navicat] 常用快捷键及注意事项
- J2EE知识体系(简单整理)
- 第5章 IDA Pro