参与活动

“我报名参加金石计划1期挑战——瓜分10万奖池，这是我的第一篇文章，点击查看活动详情”

问题描述

 问题①：TypeScript + Vue3 使用import Mock from 'mock'引入mockjs引入时报错，如下：

Cannot find module 'mockjs' or its corresponding type declarations.

 问题②：前端项目开发中利用mockJs作为假数据进行请求模拟的过程中，使用Mockjs模拟带有参数的get请求的时候，报错404无法返回正确的结果。

在发送axios请求之后报错404，如下图：

原因分析：

问题一：

  进入到mockjs目录下的index.ts文件，我们可以看到mockjs的导出方式为：export = mockjs。这也正是导致ts报错的原因，因为导出的方式不是CommonJs或ESModule的形式，因此我们要做出相应的配置。

问题二：

  其实这个问题是因为我当时想的比较简单，以为mockjs可以自动获取到query参数，即请求路径?后面的参数，其实这是不行的，在mock中的路径如果为字符串，则需要完整匹配。

解决方法：

 解决方法其实也比较简单，只要我们将字符串匹配改为正则匹配即可，之后便可以匹配到这一次的mock请求了，同时我们可以得到mockjs传入的参数msg：

msg对象结构如下：

这一块的完整代码如下：

再一次尝试后，结果如下：

总结

 可以看到，在使用正则表达式之后问题就迎刃而解了。(因为今晚的游戏行为，导致现在完成文章到写总结的时候已经00:54:09了)。所以还有一些没有完善的地方，只能等下一次再写了。  如果有想看完整代码的小伙伴，可以到我的gitee上查看，具体的链接如下： https://gitee.com/Crivk/csdn-related-demo/tree/master/Vue/v3-ts-mockjs。那么这一次的文章就先到这里啦，最近还有一个BaiduMap城市组件使用的分享还在写，但是因为懒还没有怎么写，争取这个周末把它发出来！