React - 类组件 defaultProps

[jtwang7]

React - 类组件 defaultProps

参考： *React 官方文档 - 默认 Prop 值

---

函数组件中定义 props 的默认值很好理解，只要你熟悉 js, es6 的一些知识就能完全掌握。 而类组件中，props 默认值则是定义在类的静态属性上面，且这个静态属性只能是 defaultProps (是 React 内部规定的，不能随便取名)

形式一：外部定义类静态属性

class Greeting extends React.Component {
  render() {
    return (
      <h1>Hello, {this.props.name}</h1>
    );
  }
}

// 指定 props 的默认值：
Greeting.defaultProps = {
  name: 'Stranger'
};

形式二：内部定义类静态属性

class Greeting extends React.Component {
  // 类静态属性定义：js 类的一个新语法提案，此语法提案还没有最终确定，需要进行编译后才能在浏览器中运行。
  static defaultProps = {
    name: 'stranger'
  }

  render() {
    return (
      <div>Hello, {this.props.name}</div>
    )
  }
}