---
url: /docs/guide/usage/linter/rules/react/function-component-definition.md
---

### 作用

强制 React 函数组件使用一致的函数形式。

### 为什么这是不好的？

混用声明、函数表达式和箭头函数会使组件定义难以预测，也更难快速浏览。

### 示例

此规则下的**错误**代码示例：

```jsx
const Component = () => <div />;
```

此规则下的**正确**代码示例：

```jsx
function Component() {
  return <div />;
}
```

## 配置

### namedComponents

类型：`array | "function-declaration" | "arrow-function" | "function-expression"`

#### namedComponents\[n]

类型：`"function-declaration" | "arrow-function" | "function-expression"`

### unnamedComponents

类型：`array | "arrow-function" | "function-expression"`

#### unnamedComponents\[n]

类型：`"arrow-function" | "function-expression"`

## 使用方法

## 版本

此规则在 v1.75.0 中添加。

## 参考资料