高阶组件应用-登录鉴权操作

import React, { PureComponent } from 'react'

//

class LoginPage extends PureComponent {

    render() {

        return (

            <div>

              <h2>LoginPage</h2>   

            </div>

        )

    }

}

function WithAuth(WrappedComponent){

    const NewCpn = props => {

        const {isLogin} = props;

        if(isLogin){

            return <WrappedComponent {...props} />

        }else{

            return <LoginPage />

        }  

    }

    NewCpn.displayName = "AuthCpn";

    return NewCpn;

}

//购物车页面

class CartPage extends PureComponent {

    render() {

        return (

            <div> 

                <h2>cardPage</h2>   

            </div>

        )

    }

}

const AuthCartPage = WithAuth(CartPage)

 

export default class App extends PureComponent {

    render() {

        return (

            <div> 

                 <AuthCartPage  /> 

                {/* <AuthCartPage isLogin = {true} />  */}

               

            </div>

        )

    }

}