javascript - 静态 propTypes 与 React.PropTypes

Question

请不要在完全阅读之前关闭此问题。这听起来像是一个可以主要由一个人的意见来回答的问题。但是为什么会有两种 PropTypes 的实现呢？哪一个是首选？

一种方法是使用 static 关键字并定义我们的 propTypes。

class App extends React.Component {
  static propTypes = {
    ...
  }
}

另一种方法是做这样的事情:

class App extends React.Component {
  ...
}

App.propTypes = {
  ...
}

如果我们在构建用于生产的应用程序时使用 static 关键字，我们可以删除 propTypes 吗？由于鼓励删除 propTypes 以提高性能。

Answer 1

这是一个es7版本

class App extends React.Component {
  static propTypes = {
    ...
  }
}

虽然这是es6版本

class App extends React.Component {
  ...
}

App.propTypes = {
  ...
}

我个人更喜欢 es7 版本，因为查看组件顶部的 propTypes 更有意义，以概述渲染组件所需的内容(类似于什么参数是功能所需)。

不管你使用的是哪个版本，如果你想剥离propTypes用于生产，你需要使用https://github.com/oliviertassinari/babel-plugin-transform-react-remove-prop-types .或者，您可以使用 https://github.com/thejameskyle/babel-react-optimize其中包括上述转换以及其他一些好东西，因为我猜您还想进一步优化您的应用程序(: