StructureBuilder / react-keep-alive

A component that maintains component state and avoids repeated re-rendering.
MIT License
984 stars 106 forks source link

Not Support Next.js, ReferenceError: document is not defined. #31

Closed Vikingama closed 5 years ago

Vikingama commented 5 years ago
// _app.js

import React from "react";
import { Provider } from "react-redux";
import { Provider as KeepProvider } from "react-keep-alive";
import App, { Container } from "next/app";
import withReduxStore from "../lib/with-redux-store";

class Huaban extends App {
    render() {
        const { Component, pageProps, reduxStore } = this.props;
        return (
            <Container>
                <Provider store={reduxStore}>
                    <KeepProvider include="Example">
                        <Component {...pageProps} />
                    </KeepProvider>
                </Provider>
            </Container>
        );
    }
}

export default withReduxStore(Huaban);

// example.js

import Link from "next/link";
import { KeepAlive } from "react-keep-alive";

let arr = Array.from({ length: 200 }, (v, i) => i);

export default () => (
    <KeepAlive name="Example">
        <ul>
            {arr.map((v, i) => {
                const href = `item?id=${i}`;
                <Link href={href}>
                    <a>
                        <li>item{i}</li>
                    </a>
                </Link>;
            })}
        </ul>
    </KeepAlive>
);

Document and Window don't exist in Node server.

ShenChang618 commented 5 years ago

@Vikingama 发布了新版本,修正了这个问题,新版本(react-keep-alive@2.4.0