在 React 类中应该如何编写函数？

Question

我正在尝试改编来自a SO answer 的代码，函数和变量编写如下：

const getIntervals = n=> availability=> {
}

let availability = [
]

这些通常可以在反应类中使用（见下文）还是需要重写？

class Calendar extends React.Component {}

询问的原因是我使用了一个 React 实现 for Rails 并且确实收到了一个错误，包括该函数和变量命名模式。

Answer 1

纯函数，不修改传递的值，在任何地方都可以使用。

直接在 React 类中使用它们也很好，但是像字符串修改、数组排序算法这样的常用函数，你在你的应用程序和类中使用很多，应该放在一个单独的模块中，比如

// my-helpers.js

export const countKeysInObject = (data) => {
  if (typeof data !== "object" || Array.isArray(data)) return 0;

  Object.keys(data).length;
}

一些其他文件..

import { countKeysInObject } form 'my-helpers'
// And you can use it everywhere..

Answer 2

如果您使用class 并扩展Component，您可以对大多数事情使用简单的方法：

class Calendar extends React.Component {
  constructor(props) {
    this.date = props.date;
  }

  render() {
    return <span>{this.date.toString()}</span>;
  }
}

Calendar.propTypes = {
  date: React.PropTypes.date.isRequired
};

如果您使用对象字面量，则不能使用 propTypes 或任何可能是初始字段的方法。这些需要在类被声明后（propTypes）或在构造函数中（初始state）附加。