logoESLint React
Rules

no-use-context

Full Name in eslint-plugin-react-x

react-x/no-use-context

Full Name in @eslint-react/eslint-plugin

@eslint-react/no-use-context

Features

🔍 🔄

Presets

  • core
  • recommended
  • recommended-typescript
  • recommended-type-checked

What it does

Disallows using React.useContext.

In React 19, use is preferred over useContext because it is more flexible.

An unsafe codemod is available for this rule.

Examples

Failing

import { useContext } from "react";
 
function Button() {
  const theme = useContext(ThemeContext);
  // ...
}

Passing

import { use } from "react";
 
function Button() {
  const theme = use(ThemeContext);
  // ...
}

Implementation

Further Reading


See Also

On this page