React 组件的 not required prop 是否应该在 defaultProps 中

Question

首先，我已经查看了 React 的文档，但没有找到我的问题的答案。我在 SO 上做了同样的事情，但没有成功。

问题是：如果在 React 的组件中使用的 prop 不是必需的，它应该在 defaultProps 中吗？

  Component.propTypes = {
    getName: PropTypes.func,
    type: PropTypes.string.isRequired,
  };

  static defaultProps = {
    type: 'text',
    getName: () => {}, // should this be here at all ?!?
  };

我问这个是因为无论我把它放在这里还是不放，控制台都没有错误。问题是，我在一些项目中看到人们使用 defaultProps 为组件提供一些回退值，而在我从事的其他项目中，在 defaultProps 中，人们只为具有 isRequired [=17= 的字段设置回退值] 为了避免渲染错误或控制台错误，如果他们不将该道具传递给组件。

Answer 1

缺少 defaultProps 不会导致任何错误。这更像是一个好习惯。如果组件没有收到它期望的道具，则为组件的所有道具保留 defaultProps 将减少应用程序崩溃的可能性。如果这种情况处理不当，defaultProps 确实有帮助。从开发人员的角度来看，通过查看组件的 propTypes 和 defaultProps，开发人员将了解它期望的类型和值。

Answer 2

如果该函数传递给某个事件，即

<button onClick={props.callback} />

如果我这样做，有时根本不需要 onClick（就像我们只想显示按钮没有点击操作）。那个时候我们不会通过它，如果有人点击我们会得到错误 undefined is not a function 因为回调是 undefined

为了解决这个问题，我们要做的是

<button onClick={() => props.callback && props.callback()} />

但这效率不高，因为每次渲染都会创建一个新函数，这不是好的做法。

下一条路是

function Button(props) {
    <button onClick={props.callback} />
}
props.defaultProps = {
    callback: () => {} // that will fallback if is not passed.
}

这将处理回退，看起来也很干净，并且是一种更好的方法。

如果我们根据需要标记 prop 那么 eslint 无论如何都会抛出 this error

React 组件的 not required prop 是否应该在 defaultProps 中

Should React component's not required prop be inside defaultProps

reactjs

react-proptypes