加油宝专属
加油宝专属
React 组件最终会生成 HTML,所以你可以使用给普通 HTML 设置 CSS 一样的方法来设置样式。此外,React组件还增加了行内样式
– React组件内置了prop – style
可以快速方便地给组件添加行内样式。 也就是说,React支持两种指定样式方式
1 | .star { |
1 | import './star.css'; |
1 | const Styles = { |
React 作为前端框架,其管理的是一个个 UI 控件,而在 React 的语言体系中,我们将之称为 component
– 组件。
狭义上来说,组件一般是 UI 组件,负责展示及和用户的交互。而广义上,组件是带有一定业务含义的,其不仅有与用户的交互,更重要的是数据与UI控件们之间的交互。
我们在之前介绍JSX
时介绍过,React 通过自定义元素的方式实现组件化(虚拟DOM),组件元素被描述成纯粹的 JSON 对象,意味着可以使用方法或是类来构建。React 组件基本上由 3 个部分组成 —— 属性(props)、状态(state)以及生命周期方法。通过 JSX,我们通常将要渲染的组件组成一棵组件树,就像搭乐高玩具一样一步步组成最终我们想要的 UI 界面。