https://www.typescriptlang.org/docs/handbook/decorators.html

@装饰器/ @Decorator

https://www.typescriptlang.org/docs/handbook/decorators.html

什么鬼视频剪切的好明显

瞬间跳转

connect

什么鬼呀A(B)

直接 return class component

PPT & script 

Camtasia Studio

# 高阶函数 HOF

函数作为参数

函数作为返回值

# 高阶组件 HOC

组件作为参数

组件作为返回值

高阶组件 HOC

function as params

function as return value

+1+1+1+1+1

这就是代理和继承的区别。super指的是父类的render方法调用

app.css

.App {
  text-align: center;
}
*{
  margin: 0;
  padding: 0;
  list-style-type: none;
  border: none;
}

.a-container{
  min-height: 500px;
  width: 300px;
  border: 1px solid #f60;
}
.a-container .header{
  height: 30px;
  line-height: 30px;
  position: relative;
  color: #fff;
}
.a-container .header .title{
  width: 100%;
  background: #f60;
  text-align: left;
  text-indent: 10px;
}
.a-container .header .close{
  position: absolute;
  right: 10px;
  top: 0;
}

getDisplayName(WrappedComponent) {
  return WrappedComponent.displayName || WrappedComponent.name || 'Component';
}

// displayName 是静态值

继承方式的高阶组件应用：

- 操纵 prop

- 操纵生命周期函数

代理方式与继承方式高阶组件的区别

代理方式高阶组件应用：

- 操纵 prop

- 抽取状态

- 访问 ref

- 包装组件

高阶组件应用方式

使用高阶组件：

1. higherOrderComponent(WrappedComponent)

2. @higherOrderComponent

编写高阶组件：

1. 实现一个普通组件

2. 将普通组件使用函数包裹
   

高阶组件不是组件而是函数

高阶函数在数组中的应用：

- some()

- every()

- filter()

- map()

- forEach()

高阶函数基本概念

代理方式的高阶组件继承自React.Component

继承方式的高阶组件继承自它传入的组件

多个组件都需要某个相同的功能，使用高阶组件减少重复实现

装饰器  package.json--> scripts内eject   

    npm run eject