如何使用React渲染页面

 时间:2024-10-26 19:23:08

1、首先是需要引入React的脚本库的,这里需要引入三个JS文件,如下图

如何使用React渲染页面

2、然后在body区域添加一个div给div一个id标识,如下图所示,下面会将内容渲染到这个div里面

如何使用React渲染页面

3、接下来准备脚本区域,注意这里的脚本类型要写成text/babel类型的,如下图所示,这是react定义的

如何使用React渲染页面

4、然后我们在脚本区域利用ReactDOM中的render来渲染页面,如下图所示,毋队末哎它需要两个参数,一个是html内容,一个是DOM节点

如何使用React渲染页面

5、我们运行页面以后,你会在页面中看到如下图所示的内容,和我们定义的一样

如何使用React渲染页面

6、另外你也可以在脚本区域定义html的样式的,如下图所示,可以直接在reader中的html里面运用自己定义的样式

如何使用React渲染页面

7、综上所述,运用React渲染页面主要运用了其中的ReactDOM对象里面的render方法,大家可以自己实践一下。

  • Parallels Desktop pd启动顺序怎么设置调整
  • 联想笔记本g510如何在官网下载触控板驱动并安装
  • 英雄联盟之中亚沙漏如何让操作更加秀
  • 电脑网速不稳定怎么办 网络攻击行为防护方法
  • DH1720A系列单路稳定电源说明书
  • 热门搜索
    小学学校简介 苏轼生平简介 贵州了旅游攻略 洛阳旅游攻略 山村老屋攻略 仙女山旅游攻略 胡萝卜减肥 臀部减肥 ucc自行车怎么样 西岭雪山攻略