React学习(1).输出hello world

忘是亡心i 2022-10-31 12:17 25阅读 0赞

##### 引入了三个库 #####

*  ###### react.min.js - React 的核心库 ######
 *  ###### react-dom.min.js - 提供与 DOM 相关的功能 ######
 *  ###### babel.min.js - Babel 可以将 ES6 代码转为 ES5 代码，这样我们就能在目前不支持 ES6 浏览器上执行 React 代码。Babel 内嵌了对 JSX 的支持。通过将 Babel 和 babel-sublime 包（package）一同使用可以让源码的语法渲染上升到一个全新的水平 ######
 *  ###### (三个都要) 不然可能报错 ######

<!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8" />
    		<title>Hello React!</title>
    		
    		<script src="https://www.w3cschool.cn/statics/assets/react/react.min.js"></script>
    		<script src="https://www.w3cschool.cn/statics/assets/react/react-dom.min.js"></script>
    		<script src="https://www.w3cschool.cn/statics/assets/react/babel.min.js"></script>
    	</head>
    	<body>
    		<div id="example"></div>
    		<script type="text/babel">
    			ReactDOM.render(
          		  <h1>Hello, world!</h1>,
           		 document.getElementById('example')
         		 );
        </script>
    		<script type="text/javascript">
    			console.log(React);  //测试引入是否成功
    			console.log(ReactDOM);  //测试引入是否成功
    		</script>
    	</body>
    </html>

[参考链接][Link 1]

[Link 1]: https://www.w3cschool.cn/react/react-tutorial.html

发表评论取消回复

表情：

评论列表（有 0 条评论，25人围观）

还没有评论，来说两句吧...

相关阅读

相关 GLSL shader学习系列1-Hello World

这是GLSL shader系列第一篇文章，本文学习目标： 1. 安装编辑工具 2. 编写hello world程序安装插件我使用VSCode编写shader代

￡神魔★判官ぃ/ 2024年03月26日 15:11/ 0 赞/ 57 阅读

相关 22【React基础-1】Hello World

写在前面从这篇文章开始，我们重新来学习一下React的官网。本文从经典的Hello World示例开始，给大家介绍下react应用的创建，通过本文的介绍，我们学会新建一

女爷i/ 2022年12月14日 03:49/ 0 赞/ 117 阅读

相关 React学习(1).输出hello world

引入了三个库 react.min.js - React 的核心库 react-dom.min.js - 提供与 DOM 相关的功能 babel

忘是亡心i/ 2022年10月31日 12:17/ 0 赞/ 26 阅读

相关 Velocity学习（1）--hello world

主要内容：（1）velocity的介绍（2）Servlet+velocity 环境搭建和 Demo -------------------- 1 veloci

超、凢脫俗/ 2022年05月26日 08:11/ 0 赞/ 187 阅读

相关 Tkinter学习_1.Hello World 初创窗口

前言本教程取材自[Tkinter By Python][] 可自行下载PDF和源代码相关参数可以查询API[tkinter 8.5 reference][] 更多

小灰灰/ 2022年05月19日 00:40/ 0 赞/ 201 阅读

相关 QT1-Hello World

一个基础的QT界面程序首先需要使用的qt头文件 include <QtWidgets/qapplication.h> include <QtWidge

电玩女神/ 2022年05月09日 04:08/ 0 赞/ 201 阅读

相关 django学习：1.hello world

0 导言 Django是一个开放源代码的Web应用框架，由Python写成。采用了MVC的框架模式，即模型M，视图V和控制器C。它最初是被开发来用于管理劳伦斯出版集团旗下

蔚落/ 2022年03月28日 07:13/ 0 赞/ 400 阅读

相关 React(Hello World)+webpack

建立文件夹 ![文件夹项目][20190320154901703.png] package.json 这是所有的包，直接复制使用`cnpm i`来下载就可以了

迷南。/ 2022年03月02日 13:20/ 0 赞/ 185 阅读

相关ＱＴ --Hello world!　(1)

include "mainwindow.h" include <QApplication> include <QDialog> include

女爷i/ 2021年12月20日 02:45/ 0 赞/ 322 阅读

相关 C# .NET 输出“Hello World”

1. 打开VS2019，创建新项目 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_

水深无声/ 2021年12月20日 01:43/ 0 赞/ 291 阅读