React全家桶开发谷粒前后端项目（张天禹老师）

项目准备

1. 技术选型

2. 前端路由

3. API接口

知识点

• 高阶函数：如果demo函数接收一个函数作为参数，或者demo函数调用的返回值是一个函数，demo为高阶函数。
• 高阶组件：demo组件接收一个组件，加工生成一个新组件，那么demo组件就称为高阶组件。
• 高阶组件是一个特殊的高阶函数
• 配置代理：JSONP,CROS复习一下。
  在本次项目中采取配置代理的方式：package.json

"proxy":"http://localhost:5000"

代理服务器：转发请求

• post请求json形式的编码参数，是在raw里面选
  

app.use(express.json())

• 项目中axios请求的配置
  1.要新建api文件夹
  2.有三种方式进行配置

//index里面
export const reqLogin = (username, password) => {
    axios.post('http://localhost:9000/login', qs.stringify({ username, password })).then((response) => {
        console.log(response);
    }).catch((resaon) => {
        console.log(resaon)
    })
}
//login里面

```javascript
 reqLogin(username, password)

//index里面
export const reqLogin = (username, password) => 
    axios.post('http://localhost:9000/login', qs.stringify({ username, password }))
//login里面

```javascript
 reqLogin(username, password).then((response) => {
        console.log(response);
    }).catch((resaon) => {
        console.log(resaon)
    })

//index里面
export const reqLogin = (username, password) => 
    axios.post('http://localhost:9000/login', { username, password })
//使用拦截器

• 跳转页面的方式
  1.Link
  2.NavLink
  3.this.props.history

踩坑

1. 路由的使用5和6的区别

2. jsx如何导入图片
   导入图片
   在线的资源可以直接引入地址

3. 在react中出现不能把盒子100%放大的原因是：
   在放大盒子外面套着root这个盒子，还有app里的盒子。

4. 报错比如Uncaught TypeError: XXX is not a function，考虑是不是没保存程序，以及是不是打错字母了