react mock_vue mock数据

react mock_vue mock数据前言在开发项目时,前端需要和后端对接数据,但有时后端并没有写好数据,前端还需要继续往下开发,这时候就需要mock数据了。如何mock数据?如下代码,在input获得焦点时调用getList()方法。constmapDispathToProps=(dispatch)=>{return{handleInputFocus(){…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全家桶1年46,售后保障稳定

前言

在开发项目时,前端需要和后端对接数据,但有时后端并没有写好数据,前端还需要继续往下开发,这时候就需要mock数据了。

如何mock数据?

如下代码,在input获得焦点时调用getList()方法。

const mapDispathToProps = (dispatch) => { 
   
    return { 
   
        handleInputFocus() { 
   
            dispatch(actionCreators.getList())
        }
    }
}

Jetbrains全家桶1年46,售后保障稳定

getList()方法是通过Ajax获取数据,此时后端并没有写好,所以自己mock一个数据。

export const getList = () => { 
   
    return (dispatch) => { 
   
        axios.get('/api/headerList.json').then((res) => { 
   
            const data = res.data;
            console.log(data)
        }).catch(() => { 
   
            console.log('error')
        })
    }
}

axios.get('/api/headerList.json')这句代码,计算机会首先去src目录下寻找/api/headerList.json,没有找到然后去public目录下找,此时我们在public目录下建立/api/headerList.json文件,文件如下:

{ 
   
    "success":true,
    "data":["微信","支付宝","蚂蚁金服","被骗","借呗","诈骗","盗窃","pandas","TensorFlow","PyTorch","Caffe","scikit-learn","Python","Keras","pyecharts","ggplot","Matplotlib","Gensim","Bokeh","Theano","Scrapy","SciPy","Plotly","NumPy","XGBoost","是","他","有","光大永明","我","要","人","Android","女","大","不","着","男","它","二","于","中","java","把","上","这","下","的","了","来"]
}

此时返回的数据就是以上数据,通过console.log(res.data)打印数据如下图:
在这里插入图片描述

这样mock数据就成功了。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/222871.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • 可赎回债券「建议收藏」

    可赎回债券「建议收藏」可赎回债券的价格可赎回债券(callablebonds):发行人有权赎回的债券。为什么发行可赎回债券?通常有赎回保护期(callprotectionperiod),有相对较高的收益率补偿赎

  • pycharm 激活码 2021_最新在线免费激活

    (pycharm 激活码 2021)好多小伙伴总是说激活码老是失效,太麻烦,关注/收藏全栈君太难教程,2021永久激活的方法等着你。IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.cn/100143.html83PVI25FMO-eyJsaWNlbnNlSW…

  • 免备案CDN推荐+教程

    免备案CDN推荐+教程文章目录前言一、CDN1.注册2.配置二、域名解析三、Nginx配置修改前言最近在搭建个人博客,到备案的时候发现困难重重(很麻烦),然后就想着用点其他法子。于是乎网上搜到了这个免备案CDN,花了一会部署完成后,感觉还不错就记录下来。附上我的博客链接:chasezc,功能还不是很完善,还在继续补充。一、CDN在网上查到的这个叫Nodecache,主要提供CDN、DNS、SSL证书等业务,亚太节点有我们喜欢的香港线路,速度很不错。1.注册首先我们去官网上注册:https://www.node

  • 用SrvAny.exe封装服务「建议收藏」

    用SrvAny.exe封装服务「建议收藏」用SrvAny.exe封装服务

  • seaJs 使用

    seaJs 使用

  • java lang nullpointer_java.lang.throwable

    java lang nullpointer_java.lang.throwableIntentintent=registerReceiver(null,newIntentFilter(Intent.ACTION_BATTERY_CHANGED));查询电量的时候可以通过上面这种方式返回一个intent,从这个intent中也确实能够拿到我们想要要的信息,但是平常我们注册普通的广播的时候都习惯传入一个receiver,如果有电量改变就会不停的执行receiver的onR…

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号