React第四天学习

内容：网络请求、UI库

一、网络请求

配置代理

在项目根目录的package.json的第一层配置选项中增加一行

"proxy":"目标域名地址[:端口号]"

在页面中发起网络请求时，不需要写要请求的接口域名，直接写请求地址即可。

注意：一定要重启react项目

1.jquery

(1)安装

npm install jquery --save

(2)引用

import $ from 'jquery'

(3)使用

$.ajax({
    url:'要请求的地址（不包含域名和端口号）',
    success:function(){
        
    }
})

2.axios

(1)安装

npm i axios --save

(2)引用

import axios from 'axios'

(3)使用

axios({
    url:'/api/userlist'
}).then(res=>{
    this.setState({
        users:res.data.data
    })
})

3.fetch

fetch它不需要安装

fetch('请求地址',[配置选项]).then(获取响应，要对响应进行JSON处理).then(获取JSON处理之后的数据)

get请求：

fetch('请求地址').then(res=>res.json()).then(resJson=>{...})

post请求：

fetch('请求地址',{
    method:'post',
    headers:{
        'Content-Type':'application/json'
    },
    body:JSON.stringify({key:value})
})

二、UI库

ant-design

1.安装

npm install antd --save

2.引入样式

src/App.js

import 'antd/dist/antd.css'; 

三、作业

使用antd进行后台页面布局，做管理员管理、轮播图管理功能。