了解React框架

只在空想家

已于 2022-07-25 23:29:32 修改

阅读量133

点赞数

分类专栏： React 文章标签： react.js javascript 前端

于 2022-07-25 23:17:16 首次发布

本文链接：https://blog.csdn.net/qq_42760314/article/details/125985413

版权

React 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

本文介绍了React框架的基础，包括如何使用JSX创建虚拟DOM，并阐述了虚拟DOM与真实DOM的区别。通过实例展示了在浏览器中渲染React组件的过程，同时详细讲解了JSX的语法规则，如类名指定、内联样式等要点。

摘要由CSDN通过智能技术生成

文章目录

- 了解React框架
- - 虚拟DOM与真实DOM区别
  - JSX语法规则

了解React框架

初级学习框架模板：

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<div id="test"></div>

<script type="text/javascript" src="react-js/react.development.js"></script>
<script type="text/javascript" src="react-js/react-dom.development.js"></script>
<script type="text/javascript" src="react-js/babel.min.js"></script>

<script type="text/babel">
    const VDOM = <h1>Hello World!</h1>;
    ReactDOM.render(VDOM, document.getElementById('test'));
</script>
</body>
</html>