Home > Net >  Passing props from outlet to parent using React Router 6
Passing props from outlet to parent using React Router 6

Time:01-26

I'm using React Router V6 and im trying to figure out if I can pass props from nested routes which are rendered using components. I can't seem to figure it out though. Can anyone help?

E.g. trying to pass the title prop from BleTable ("Bluetooth") to App

ReactDOM.render(
  <React.StrictMode>
    <BrowserRouter>
      <Routes>
        <Route path="/" element={<App title="**Title from outlet**" />} >
          <Route path="ble" element={<BleTable title="Bluetooth"/>}/>
          <Route path="create-user" element={<UserForm/>}/>
        </Route>
      </Routes>

    </BrowserRouter>
  </React.StrictMode>,
  document.getElementById('root')
);

CodePudding user response:

You can't pass props, per se, but you can provide a context value to the Outlet that App is rendering that the routed components can access via the Edit passing-props-from-outlet-to-parent-using-react-router-6

  •  Tags:  
  • Related