多语言展示
当前在线:1977今日阅读:22今日分享:22

如何使用React中的className对标签设置样式类

在我们使用React时,除了使用style标签绑定具体的样式属性之外,还可以使用className属性,这个需要在之前设置一个样式类。下面利用实例说明className属性的用法,操作如下:
工具/原料
1

JavaScript

2

HTML5

3

CSS3

4

HBuilderX

5

React

6

浏览器

7

截图工具

方法/步骤
2

第二步,分别使用元素选择器设置全局样式,然后使用类选择器设置div和有序列表的样式,如下图所示:

3

第三步,在div标签下方添加一个script标签,然后在这个标签内定义一个类Ols,如下图所示:

4

第四步,在第三步中的createElement方法中添加className属性,如下图所示:

5

第五步,再次调用ReactDOM渲染元素,保存代码查看结果,结果出现了报错,如下图所示:

6

第六步,检查发现是类中的render()方法,需要使用一个大括号,将返回值中的内容包裹起来,如下图所示:

注意事项
1

注意React中的className对标签样式类进行绑定

2

注意利用React.createElement方法创建元素

推荐信息