Passing data to next screen in react-router

I want to pass the username variable to the next screen in react-router v6:

// Sample 
const App = () => {

const pass = () => {
//Variable to be passed
let username = 'john.smith'
  navigate('next-screen', /*data*/)
}

return(
  <button onClick = {pass}></button>
)
}


export default App