https://github.com/baotlake/nextjs-keep-alive-demo

Nextjs keep alive demo
https://github.com/baotlake/nextjs-keep-alive-demo

demo keep-alive nextjs react

Last synced: 2 days ago
JSON representation

Nextjs keep alive demo

• Host: GitHub
• URL: https://github.com/baotlake/nextjs-keep-alive-demo
• Owner: baotlake
• Created: 2021-06-14T15:42:11.000Z (over 3 years ago)
• Default Branch: master
• Last Pushed: 2021-06-14T15:44:57.000Z (over 3 years ago)
• Last Synced: 2024-10-12T07:04:04.449Z (3 months ago)
• Topics: demo, keep-alive, nextjs, react
• Language: JavaScript
• Homepage:
• Size: 38.1 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
这是一个Next.js实现`keep-alive`的Demo

# 用法

1. 将需要保留的页面添加到`pages/_app.js`中`keepAlive`数组中

```Javascript

    // 例如

    [

        {

            // 页面路由

            route: '/alive',     

            // 用于保存页面组件       

            PageComponent: undefined,   

            // 页面显示/隐藏状态

            active: false               

        }

    ]

```

2. 在需要保留的页面组件中接收`props.active`，并实现显示/隐藏

```Javascript

export default function Page(props) {

    return (

        


            { /** ... */}

        

    )

}

```