在中文中,`React`的`className`是什么意思?

你经常看到className对吧?
这次,我来解释一下className,以便初学者也能明白。

首先,class和className有什么区别?

当在HTML中指定样式时,我们使用class属性,对吧?但是,在React的JSX(类似于用JavaScript编写的HTML)中,我们使用的是className而不是class。为什么呢?因为在JavaScript中,class具有特殊的含义。

? 要点:在React中指定样式类时,请使用className!

2. 如何使用className

超级简单!用字符串写类名。

<div className="my-style">
  こんにちは、React!
</div>

3. 当想要指定多个类时该怎么做呢?

只需要用空格隔开就可以了!

<div className="style1 style2">

4. 我想根据条件改变班级!

就像这样,您可以使用条件动态地更改类名。

const isBlue = true;

<div className={`box ${isBlue ? 'blue' : 'red'}`}>

? 提示:使用反引号和${}可以将变量的内容嵌入字符串中!

广告
将在 10 秒后关闭
bannerAds