核心概念

JSX #

props #

state #

纯函数 #

纯函数- wiki

React - 纯函数

  • 不会尝试更改入参,且多次调用下相同的入参始终返回相同的结果
  • 不会触发事件

react 的 className

Refs #

React.createRef 创建一个能够通过 ref 属性附加到 React 元素的 ref

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.myRef = React.createRef();  }
  render() {
    return <div ref={this.myRef} />;  }
}

默认情况下,你不能在函数组件上使用 ref 属性,因为它们没有实例,你可以在函数组件内部使用 ref 属性,只要它指向一个 DOM 元素或 class 组件:useRef(null);

理解:“函数组件没有实例”

context #

为了避免变量通过 props 层层传递,可以只在最顶层的组件中设置 context,然后所有的子组件都可以通过 this.context.xx 获取到。

数据流 #

类似 Vue 的“双向数据流”在 react 里怎么实现的?可以通过 redux 实现

hook #

Hook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。