前端实习第五周周记

前言

每一天做了什么还是要记录一下,不然过两天后就会发现,慢慢遗忘自己的收获与做过的东西。

这周做的是医学检验系统的样本库部分。由于是公司的代码所以不能交代具体,那么久聊一下每天具体做了些什么以及我的一些收获。

周一

周一上午利用treambition拿到任务后,深感任务繁重。本周任务集中在样本库表格,以及表格的一些功能,比如新增,修改等。

但是表格的特殊之处在于,它不是一般的表格,而是带树状的表格,我可以稍微描述一下,每一种类型的菌,会有它旗下的子菌,子菌还有很多的传代菌。做这一块就需要前端的逻辑与和后端配合的默契。

第一天下午封装了三个接口,分别是查询、修改、以及查询子菌。

并且还改了一个bug,一个能跑起来但是显示数据未定义的奇怪bug,记录博客如下:

前端能正常跑起来但是控制台报错数据undefined之onMounted最好不要用异步写法

周二

周二做的任务就是渲染那张树型表格。由于是树的数据结构。我来说一下后端的逻辑。数据有一万多条,非常多,一下子渲染出来是不现实的。所以后端希望前端能分步渲染的做法。

我来说一下后端给我的逻辑。首先,一张表,有一些菌的类型。有的菌有子节点,有的没有。有子节点的菌有一个字段标识。在一开始的时候,前端只需要渲染第一层数据。在渲染的时候,判断那个标识,如果有标识的话,再根据标识利用一个查询子节点的接口,查到数据后把数据放到查到的数据中,并在表格中渲染出来。

在element-ui中,如果一层数据嵌套另一层,是可以被按照层级渲染出来的。于是利用代码渲染第一次后作条件判断,成功做出第二层。

简单带过的就是分页,拿到一个前端的分页器后,获取分页器中拿到的页数,尺寸,并保存。在需要的时候传给后端即可。

周三

第三天做的是按钮功能,比如入库,出库,修改的功能。其实就是调用一个接口------更新接口。

另外做了增添同级菌,传代菌的功能。逻辑很简单,点击表格的一行,点击新增同级菌按钮,那么前端会拿到数据,并且修改其id为空(后端自动生成),由于是同级,父节点直接继承拿到的数据即可。

新增传代菌逻辑有问题就先没做。

周四

测试功能并发现数据都有问题,发现问题,记录如下:

前端修改新增操作导致数据删除------js精度丢失

就是这个问题导致我所有的操作多少都有问题。解决就好啦。增加了新增传代菌的功能,把父亲的节点的id作为自己的父节点id,子节点为空。

今天还对修改按钮作了修改,只要是后端能反查到的数据,都不能轻易修改,这很重要。所以要提前跟后端交涉好,这样前端的效率也会提起来。

周五

完成了一个小的问题,以及继续解决问题。之前遗留的问题还在,下周继续加油。

相关推荐
Justin3go7 小时前
HUNT0 上线了——尽早发布,尽早发现
前端·后端·程序员
怕浪猫8 小时前
第一章 JSX 增强特性与函数组件入门
前端·javascript·react.js
铅笔侠_小龙虾8 小时前
Emmet 常用用法指南
前端·vue
钦拆大仁8 小时前
跨站脚本攻击XSS
前端·xss
VX:Fegn08959 小时前
计算机毕业设计|基于springboot + vue校园社团管理系统(源码+数据库+文档)
前端·数据库·vue.js·spring boot·后端·课程设计
ChangYan.10 小时前
直接下载源码但是执行npm run compile后报错
前端·npm·node.js
skywalk816310 小时前
在 FreeBSD 上可以使用的虚拟主机(Web‑Hosting)面板
前端·主机·webmin
ohyeah11 小时前
深入理解 React 中的 useRef:不只是获取 DOM 元素
前端·react.js
MoXinXueWEB11 小时前
前端页面获取不到url上参数值
前端
低保和光头哪个先来11 小时前
场景6:对浏览器内核的理解
开发语言·前端·javascript·vue.js·前端框架