javascript - 如何将 HOC props 传递给 getInitialProps？

Question

在 _app.js 中，我用一个获取用户状态的 HOC(高阶组件)包装了我的 MyApp。

import AuthHoC from '../utils';
import App from 'next/app';

class MyApp extends App {
  render() {
    const { Component, pageProps, isAuthenticated, idToken } = this.props;

    return (
      <Component 
        {...pageProps} 
        isAuth={isAuthenticated} // Given by AuthHOC
        idToken={idToken}        // Given by AuthHOC
      />
    );
  }
}

export default AuthHoC(MyApp); 

在我的页面中，我想通过 getInitialProps 获取状态。

class Page extends React.Component {
    ...
    render() {
        return (
            <Layout>...</Layout>
        );
    }
}

Page.getInitialProps = async (ctx) => {
    console.log('How can I access this -> isAuthenticated'); 
    // if user is not auth, redirect or pass.
    return {}
};

export default Page;

如何在 Page.getInitialProps 中获取 isAuthenticated ？

当然我可以使用 ComponentDidMount() 来根据用户的状态进行重定向，但是有一个轻微的加载时间，他们可以在 Router.push('/') 触发器。这就是为什么我认为使用 getInitialProps 更合适。

Answer 1

无法从静态方法访问实例属性。请参阅:How to access non static property from static function in typescript

尽管它是 typescript ，但适用相同的规则。