class - 将 propTypes 和 defaultProps 作为静态 props 放入 React 类中可以吗？

Question

这就是我长期以来一直这样做的方式:

export default class AttachmentCreator extends Component {
  render() {
    return <div>
      <RaisedButton primary label="Add Attachment" />
    </div>
  }
}

AttachmentCreator.propTypes = {
  id: PropTypes.string,
};

但我见过有人这样做:

export default class AttachmentCreator extends Component {
  static propTypes = {
    id: PropTypes.string,
  };

  render() {
    return <div>
      <RaisedButton primary label="Add Attachment" />
    </div>
  }
}

事实上，我也看到人们在构造函数之外设置初始状态。这是好的做法吗？这一直困扰着我，但我记得在某个地方的一次讨论中，有人说将默认 Prop 设置为静态并不是一个好主意 - 我只是不记得为什么。

Answer 1

其实从性能上来说是完全一样的。 React.JS 是一项相对较新的技术，因此尚不清楚什么是好的实践，什么是不好的实践。如果您想信任某人，请查看此 AirBNB 的样式指南:

https://github.com/airbnb/javascript/tree/master/react#ordering

import React, { PropTypes } from 'react';

const propTypes = {
  id: PropTypes.number.isRequired,
  url: PropTypes.string.isRequired,
  text: PropTypes.string,
};

const defaultProps = {
  text: 'Hello World',
};

class Link extends React.Component {
  static methodsAreOk() {
    return true;
  }

  render() {
    return <a href={this.props.url} data-id={this.props.id}>{this.props.text}</a>
  }
}

Link.propTypes = propTypes;
Link.defaultProps = defaultProps;

export default Link;

他们使用 propTypes 对象文字声明 const，保持类非常干净，并稍后将它们分配给静态属性。我个人喜欢这种方法:)