React.js：基础知识

你好，我的名字是托尼和。 这些教训我们来看看。 类组件是什么，它们的结构和生命周期 功能、道具、管理和使用。 以及状态管理和使用。 在本课中，我们将了解什么是 React 组件， 如何使用它们以及它们如何对我们的写作有帮助 轻轻地快速高效地应用。 现在，组件就是其中的一部分。 与标准非常相似的客户端代码 JavaScript 函数有一个明显的区别是 组件将始终返回 HTML。 这是必须的，因为这是我们用户的视觉作品 去看并互动。 当构建一个组件时，最好以这样的方式构建它： 方式，以便它是独立的并且没有任何 与应用程序中其他任何内容的相互依赖性。 这意味着我们可以在任何我们想要的地方独立使用它 在我们的应用程序中，不会创建意外的 来自显性或隐性的后果 依赖关系。 让我们看看 React 组件是什么样子的。 让我们通过运行 NPM start 来启动我们的应用程序 命令 和我们的应用程序。 将从端口 3000 启动。 对于这部分。 我继续前进，实际上我提前创建了组件 时间来保存。 我们有一点时间，只是看我打字有所不同。 因此，让我们将一个类组件放入其中。 我们的界面 看看它是什么样子的。 你可以看看这是什么。 基本上是一个颜色选择器 当我们改变颜色时我们可以实时看到 一切都会更新。 屏幕和用户可以在浏览器中看到它。 我们的班级示例如下所示。 所以。 所有 React 类组件都扩展了 React 组件，它是 由 React 组创建和维护的实体。 因此它具有一定的生命周期功能 可供它使用。 我们稍后会讨论所有这些。 现在我们只是看看什么是组件 熟悉。 我们自己和它的本质。 现在您可以看到这个函数是唯一的函数 确实需要，因为这将返回 HTML 或视觉表示。 我们的组件也就是用户的东西。 会去看并互动。 正如我们前面提到的。 现在让我们看看是什么。 一个功能组件看起来像。 我们也将其放入我们的应用程序中。 我们可以看到 视觉上和。 从功能上来说，它与我们基于类的没有任何不同 成分。 它的外观、感觉和功能 以完全相似的方式。 但当谈到它的实施时。 它确实有很大的不同。 你可以看到它并没有真正扩展任何东西 React 并不是真的。 除了内部之外，这里的任何地方都提到过。 该组件使用了一些特殊功能，这些功能是 由 React 小组分发。 但我们稍后会讨论这些，让我们。 也不用担心那些。 现在还很多，但我们拭目以待。 我们看到这只是一个普通的 JavaScript 对象 和这里的。 Course 是它的 HTML 部分，与我们的课程相同 为基础的部分。 这就是用户看到并与之交互的内容。 但正如您所看到的，这非常适合 组件，因为它通过了。 我们的另一个标准是。 之前设定的是它是完全独立的并且 不依赖于应用程序中的任何其他内容，这意味着我们 可以单独使用它与其他东西结合使用 应用程序中的其他任何地方 不会造成任何意想不到的后果 来自隐式或显式的依赖关系。 在我们的下一课中，我们将学习。 看看 JSX 有何不同。 从常规 HTML 以及它如何在 React 上下文中使用 应用。 感谢您的观看。