# Como evitar prop drilling no React > Estratégias e padrões para resolver o problema de prop drilling em aplicações React - Author: Franklin Javier - Published: 2022-12-07 - Language: Português (Brasil) - Tags: react, frontend - Canonical: https://blog-preview.imfrank.dev/pt-br/blog/evitando-prop-drilling-react/ Prop drilling é um padrão comum em React onde você precisa passar dados através de múltiplos componentes intermediários para chegar ao componente que realmente precisa deles. Isso se torna problemático porque torna o código mais difícil de manter e reduz a reusabilidade dos componentes. ## O Problema Quando você tem uma hierarquia profunda de componentes e precisa passar dados do topo até o fundo, acaba tendo que passar props por todos os componentes do meio, mesmo que eles não usem esses dados. ## Soluções ### 1. Componentes Intermediários Crie componentes wrapper que recebem e encaminham props pela hierarquia. Isso pode organizar melhor a estrutura, mas não elimina completamente o problema. ### 2. React Context Use a Context API do React para "passar dados para componentes aninhados sem ter que passar props manualmente em cada nível". Esta é a solução mais comum e recomendada pelo próprio React. ```javascript const ThemeContext = React.createContext('light'); function App() { return ( ); } ``` ### 3. React Hooks Use hooks como `useContext` para acessar o contexto de forma simplificada: ```javascript function ThemedButton() { const theme = useContext(ThemeContext); return