继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

16、axios的使用与数据的mock2(使用proxyTable代理)

LEATH
关注TA
已关注
手记 315
粉丝 93
获赞 466

前言:上篇讲了axios的基本使用然后写了个json文件mock了下数据,最后我们安装了express并在webpack.dev.conf.js中配置后成功的在浏览器中访问到了数据。但是这样访问mock数据的方式未免太过麻烦,所以这章我们用简单的proxyTable代理的方式访问mock数据。

1、设置proxyTable

webp

设置proxytable代理

新增这几条的代码是什么意思呢?

(1)当你请求/api的时候,转发到http://localhost:8080这台端口号为8080的服务器上;

(2)一旦你请求是以/api开头的,就把它替换为/static/mock这个路径;

2、使用axios获取mock数据

好了,知道了新增几行代码的意思,我们就在home.vue页面用这种方式访问下数据

webp

使用axios

3、去浏览器中看看是不是访问成功了

webp

localhost

没问题,至此,我们通过两种方式从本地获取了数据,接下来就是把数据渲染到页面上了。



作者:Ewall_
链接:https://www.jianshu.com/p/896f8127fe60


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP