当页面加载到reactjs时如何显示组件

Question

Thanks for the great job here. I am new on reactJS and building my application view layer with it.

I am trying to make a header with a message load 3 seconds after the page loads completely and I have no idea here to start.

Google search was not fruitful so I am asking our developer community for some help.

Here is what I want to do : When page finish loading I want a header to load 2 seconds after the page is complete loading.

Please be nice , I am a newbie.

Answer 1

Something like this?

 class Home extends React.Component { constructor() { super(); this.state = { showHeader: false } } componentDidMount() { setTimeout(() => this.setState({showHeader: true}), 2000); } render() { return ( this.state.showHeader && <div>Header</div> ); } } ReactDOM.render(<Home/>, document.getElementById('app')) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> <div id='app'/>