react 的跨域请求数据的方法

本文介绍了在React中实现跨域请求数据的步骤。首先,将数据接口封装到生命周期函数中,然后将接口地址存放在`package.json`文件中,而请求参数则在接收数据的组件中设置。在`package.json`中添加相应配置以实现跨域。
摘要由CSDN通过智能技术生成

下面是数据接口

http://v.juhe.cn/toutiao/index?type=&key=304e0e410d0de9779780d834f6a01956

实现跨域请求数据的方法
第一步:把数据连接封装在一个函数里(这里我封装在了,生命周期函数里)
react 自己定义的跨域请求需要把接口前面的地址拆出来比如: http://v.juhe.cn/toutiao/index?type=&key=304e0e410d0de9779
http://v.juhe.cn/toutiao/index? 这就是地址;
地址需要放在 package.json 文件里;
请求参数放在接受数据的页面里如下代码(请求参数):

 componentDidMount(){
    fetch('type=&key=304e0e410d0de9779780d834f6a01956')
    .then( res => res.json() )
    .then( data => {
        console.log(data.result.data)
        this.setState({
          toutiao : data.result.data
       
        })
    })
   
}

在这里插入图片描述
请求地址:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值