ReactJS + NextJS - How to pass props from _app.js to page?

user_5157268 0
Viewed 1546

I just switched from ReactJS to NextJS and I can't find how to pass props from _app.js to a page.

I'm trying to call a function in _app.js from a different page. In ReactJS it was straight forward, since you had to make your own Router, you could just pass props from App.js down to the pages. Now in NextJS I'm not explicitly calling the page, so I can't pass the props anywhere.

What is the way to do it in NextJS?

next.js reactjs javascript
2 Answers

_app.js

function MyApp({ Component, pageProps }) {
const yourFunction(); // this is your function you created

return <Component {...pageProps} yourFunction ={yourFunction}/> // here you pass it as a prop
}

In page.js

default export function Page({yourFunction}) { // destructure the function 

yourFunction(); // use the function
}
user_185123960

Here is an example for redux

Cover <Component/> with redux <Provider/>

import { store } from "../redux/store/store";
import { Provider } from "react-redux";

export default function MyApp({ Component, pageProps }) {
    return (
        <Provider store={store}>
            <Component {...pageProps} />
        </Provider>
    );
}
user_178311490
Related