当前位置: 首页 > Web前端 > vue.js

关于使用unicloud-db组件进行联表查询遇到的问题及bug修复体验

时间:2023-03-31 15:55:28 vue.js

前段时间使用unicloud-db组件对云数据库进行联表查询。结果,我遇到了一些问题。记录一下起因:事情是这样的,组长给了我一个任务,说运营小姐姐们要在后台加一个接口,可以查看图书等物品的借还,方便她们可以做一个整体的管理,所以我安排去做。正文:由于后台管理界面是同款风格,我赶紧设置基本界面(dddd,感动哈哈哈),然后根据唯一索引_uid,找了三张表,做了主次区分,如下:对于联表查询的具体规则,可以查看unicloud-db的组件介绍,这里贴上链接:unicloud-db介绍同时链接分表字段时,需要根据foreignKey进行设置在数据库中设置。而uid是主表用来连接两个子表的foreignKey,这里就不截图了(是的,book_id就是foreignKey和字段名,我不知道他们是怎么设置的他们建的数据库,一开始真的是帮我搞的混)接下来,把显示的字段写进去就行了。这里值得注意的是,调用组件从云数据库返回的值是一个数组,其中嵌套了Object。如果不明白返回值是什么,可以一层层输出到控制台查看,便于理解数据类型和发现问题修复bug。问题来了:一切准备就绪后编译,但是有问题,因为时间有点久了,不想改代码回去重现哈哈哈,所以口述了下:是我的item.book_id[0].title”titleisundefined”,book_id上肯定也出现了同样的问题,但是同样写的item.uid[0].name没有错误,当我删除后缀定义的title和book_id时,不会报错,但是页面表单上不会显示数据,所以重新添加,用console.log输出上面提到的数组,发现数组的legnth为0,所以没有的时候获取到数据库中的数据,会显示undefined。这真的把我搞砸了。一开始一直以为是写法的问题,但是看了正确答案想了想,想不出比他更正确的写法,于是陷入了自我怀疑。查了一下,原来是存在数据库中的。有脏数据。前人在进行借阅测试时,没有填写书名和其他遗漏的字段,就进入了数据记录。导致从数据库中获取数据遇到空数据字段时会报错。如果该字段填写完整,则不会报错。修改方法:bug好修,发现问题有点崩溃哈哈哈可能是我内心不够强大吧,把那两个字段拿出来做个if判断: