# react/no-this-in-sfc

> Disallow `this` in function components

A function component gets its props as an argument. React calls it without a `this`, so `this.props` throws a `TypeError`. This often happens when a class component is rewritten as a function and one `this.` is left behind.

{/* Generated by src/codegen/lint-rule-docs.ts. Do not edit this section. */}

## Configure

Off by default. To turn it on:

```toml bunfig.toml
[lint.rules]
"react/no-this-in-sfc" = "error" # or "warn"
```

{/* End of the generated section. */}

## Examples

Reported:

{/* bad */}
```jsx
function Greeting(props) {
  return <h1>Hello, {this.props.name}</h1>;
}
```

Not reported:

{/* good */}
```jsx
function Greeting(props) {
  return <h1>Hello, {props.name}</h1>;
}

class Welcome extends React.Component {
  render() {
    return <h1>Welcome, {this.props.name}</h1>;
  }
}
```