react-3 react 是怎么显示页面的，通过简单的例子来尝试

我们通过create-react-app 创建了简单的 react 项目，也查看了这个自动创建的项目的目录；

下面看一下，这个 react 页面是如何显示的：

                                                            

第一步，我们打开 public 目录下的index.html 

               即便我们对这个react 项目一点也不了解，也能够知道这个index.html 文件就是我们的首页文件；

               那么我们便找到了一个了解react 项目的突破口，我们打开这个页面：发现和正常的网页没什么区别，

               但是就是没什么内容，那网页中显示的内容是从哪里来的呢？我们发现 body 中仅有一个 id=root 的div

               好了，刚找的突破口在这里就中断了，react 网页显示的内容到底是从哪里来的，这里明明什么都没有啊；

               

第二步： 我们打开 src 目录中的 index.js

                发现这里有个比较特殊的地方：

ReactDOM.render(<App />, document.getElementById('root'));

                我们又发现了root 的踪影，这里的 reactDOM.render 方法把我们写的页面渲染到 id= root 的div中了；

                所以，react中显示的页面就是这个 reactDom.render() 方法的第一个参数；

                这里的第一个参数是 <App/>  ， 这个<App/> 是个 react 组件，这里先不关心这个组件，我们只要知道

                这个组件就是页面就可以了，下面我们不使用组件来显示一下页面：

                我们直接在这里写上要显示的页面，那么首页的内容就是这个地方的代码，下图

                h

                

                所以可以看出，react 是在index.js 中使用 ReactDom.render() 方法，把我们写的页面作为第一个参数，

                然后渲染到我们要显示的地方，也就是第二个参数；