react--简单组件使用axios

最新推荐文章于 2024-08-18 19:37:55 发布

黑芝麻饺子

最新推荐文章于 2024-08-18 19:37:55 发布

阅读量1k

点赞数

分类专栏： react 笔记文章标签： react使用axios

本文链接：https://blog.csdn.net/weixin_41108537/article/details/100071727

版权

本文介绍了如何在React组件中使用Axios进行API请求。首先通过Node.js搭建服务器，然后详细讲解了Axios的下载、配置以及在组件中的引入和使用。特别指出，推荐在`componentDidMount`生命周期钩子中发起请求，但需处理跨域问题。通过在`package.json`配置代理解决跨域，对于多服务器情况，提供了更高级的代理配置方法。

摘要由CSDN通过智能技术生成

react–简单组件使用axios

先试用nodejs构建一个服务器

//app.js
const express  = require('express');

const serve = express();

serve.listen(3001);

serve.get('/data/demo1',(req,res)=>{
    res.send({
        code:1,
        data:{
            name:'埃利斯',
            age:12
        }
    })
})

正文
跳过项目创建

npm i axios -s

1.下载axios
2.新建一个axios.js,用来配置axios默认设置
不配也没关系,主要是要export 一个axios能让组件使用

import Axios from 'axios';

export const $= Axios.create({
    withCredentials:true
})

3.组件中引入并使用axios

import React, { Component } from 'react';
import {$} from '../axios';
class Myspan extends Component {
    constructor(props){
        super(props);
        this.state ={
            userinfo:{

            },
            getInfo:false
        }
    }
    render(){