React—条件渲染不同的组件

import React from 'react';
import ReactDom from 'react-dom';

class UserGreeting extends React.Component {
    render () {
        return (<h1>欢迎回来!</h1>)
    }
}
class GuestGreeting extends React.Component {
    render () {
        return (<h1>请先注册!</h1>)
    }
}
class Greeting extends React.Component {
    render () {
        if (this.props.isLogin == false) {
            return (
                <GuestGreeting></GuestGreeting>
            )
        } else {
            return (
                <UserGreeting></UserGreeting>
            )
        }
    }
}

ReactDom.render(
    <div>
        <Greeting isLogin={true}></Greeting>
    </div>,
    document.getElementById('root')
)


发布了157 篇原创文章 · 获赞 15 · 访问量 5万+

猜你喜欢

转载自blog.csdn.net/Poppy_LYT/article/details/100702243
今日推荐