踩坑实录(Third Day)

临近年关,同事们该回家的也都回家了,所以我对工作的欲望不是很强烈,所以就主要是自己学习了一下,在 B 站看看视频,自己敲代码,所以今天没遇到什么坑,但是可以分享一下之前踩到的两个坑。

此为第三篇(2024 年 02 月 07 日)

问题一

问题背景:解决控制台报错的时候发现了一个错误,主要是针对后端返回数据与前端所需要的不一致。在使用 Element UI 这个组件库的时候,会使用到一些组件,比如表格、表单等,这些后台管理系统中常用的组件,在使用这些组件的时候,往往需要我们绑定一些数据,这些数据大多是后端返回的,前端直接渲染即可。

问题描述:前端组件期望接受一个参数,这个参数是一个字符串,但是后端返回的却是 null ,很多情况下都是这样,所以控制台就报出一个错误,大致意思就是:期望得到一个字符串,但是得到了一个 null 。虽然不影响渲染和使用,但是在控制台报错,使我这个强迫症患者很难受,于是也就一并解决了。

因为我是做前端开发的,所以这里咱们就不写 demo 了,这个问题也很通俗易懂,直接开始我们的解题思路分享吧~~~

  • 解题思路:

    控制台报出的错误已经很明显了,就是需要接受一个字符串类型的参数,但是得到了 null ,那我们就需要把后端所有返回 null 的属性值,全部替换成空字符串('')即可。

    js 复制代码
    // 在这里我写了一个工具类,工具类暴露出一个 formdate 方法,对返回数据进行以一个格式化
    export default {
        formdate: function(data) {
            return JSON.parse(JSON.stringfy(data).replaceAll(/null/, '""'))
        }
    }

    在这里我的思路是:

    1. 先将接收到的数据传递到 formdate 方法中,然后将传递过来的数据通过 JSON.stringfy() 方法转换成 JSON 字符串。

    2. 然后采用字符串的 replaceAll() 方法将字符串中的所有 null 转换为空字符串。

    3. 最后,通过 JSON.parse() 方法解析刚才的字符串,并返回。

    这样我们在使用的时候,就可以将后端的返回数据通过包裹一层 formdate 方法,来达到将 null 换成字符串的需求。

当然,解决方案并不只是这一种,大家有其他思路的也可以分享在评论区。

问题二

问题背景:今天闲着无聊,自己构建了一个 Vue3 的项目,在这个过程中,遇到了一个错误,百度了一下,没有找当相关的经验,不是很难,但是还是想跟大家分享一下。

问题描述:在构建 Vue3 应用的时候,想着使用 Eslint 对代码进行格式化校验,于是下载完 Eslint 之后,使用 npx eslint --init 的初始化 Eslint 配置的时候,控制台报了好长一串错误,我人都麻了。。。

  • 报错信息如下:

以前没有见过这个报错,霎时间有点不知所措,赶紧去百度,但是找了半个小时,并没有找到相关的解决方案,于是抱着自己试一试的心态,猜测可能是因为当前电脑用户没有权限,于是乎,使用管理员打开了 power shell ,输入 npx eslint --init ,在我的注视下,它竟然奇迹般的成功了,很不可思议,我猜这东西应该不是很难,所以百度没有提供相关的经验吧。

声明:

作者只记录自己在公司踩过的坑,以及提供自己的解决思路,如果有误请联系作者进行修改,不接受以任何形式的诋毁谩骂。如果有更好的方案也可以联系作者进行讨论,互相学习。

如需转载请注明文章来源。

相关推荐
昨天;明天。今天。4 分钟前
案例-任务清单
前端·javascript·css
Ljubim.te17 分钟前
软件设计师——数据结构
数据结构·笔记
一丝晨光30 分钟前
C++、Ruby和JavaScript
java·开发语言·javascript·c++·python·c·ruby
夜流冰31 分钟前
工具方法 - 面试中回答问题的技巧
面试·职场和发展
Front思32 分钟前
vue使用高德地图
javascript·vue.js·ecmascript
penguin_bark1 小时前
LCR 068. 搜索插入位置
算法·leetcode·职场和发展
蜡笔小新星1 小时前
Python Kivy库学习路线
开发语言·网络·经验分享·python·学习
zqx_71 小时前
随记 前端框架React的初步认识
前端·react.js·前端框架
惜.己2 小时前
javaScript基础(8个案例+代码+效果图)
开发语言·前端·javascript·vscode·css3·html5
speop2 小时前
【笔记】I/O总结王道强化视频笔记
笔记·音视频