React引入,运行

1.引入

<script src="https://cdn.bootcss.com/react/15.5.4/react.min.js"></script>
<script src="https://cdn.bootcss.com/react/15.5.4/react-dom.min.js"></script>
<script src="https://cdn.bootcss.com/babel-standalone/6.24.0/babel.min.js"></script>

2.内容

<div id="app"></div>
<script type="text/babel">ReactDOM.render(<h1>Hello, 简单教程!</h1>,document.getElementById('app'));
</script>

实例中我们引入了三个库: wreact.min.js 、react-dom.min.js 和 babel.min.js:
react.min.js React 的核心库
react-dom.min.js 提供操作 DOM 相关的功能
babel.min.js Babel 可以将 ES6 代码转为 ES5 代码,这样我们就能在目前不支持 ES6 浏览器上执行 React 代码。Babel 内嵌了对 JSX 的支持。通过将 Babel 和 babel-sublime 包(package)一同使用可以让源码的语法渲染上升到一个全新的水平。

注意:
如果我们需要使用 JSX,则 标签的 type 属性需要设置为 text/babel。

422101-20180625163510187-725164681.png

转载于:https://www.cnblogs.com/jiqing9006/p/9224929.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/266812.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

linux与windows间共享文件夹 FileZilla树莓派文件传输

参考&#xff1a;linux与windows间的文件共享 作者&#xff1a;丶PURSUING 发布时间&#xff1a;2021-02-09 11:37:48 网址&#xff1a;https://blog.csdn.net/weixin_44742824/article/details/113767236?spm1001.2014.3001.5502 参考&#xff1a;利用FileZilla实现ubuntu与w…

MATLAB 快速绘制曲线图的形状,粗细,颜色

MATLAB 快速绘制曲线图的形状&#xff0c;粗细&#xff0c;颜色 在写论文的时候&#xff0c;经常要用到Matlab绘制一些曲线&#xff0c;包括曲线的形状、粗细、颜色等&#xff0c;可以通过以下的piot函数实现。 1.通过改变R-G-B 的值改变线条的颜色&#xff1a; 通过改变R-G…

安装secureCRT提示sorry的解决办法

摘自&#xff1a;你的secureCRT还在sorry吗&#xff1f; 作者&#xff1a;丶PURSUING 发布时间&#xff1a; 2021-03-12 08:21:37 网址&#xff1a;https://blog.csdn.net/weixin_44742824/article/details/114684721?spm1001.2014.3001.5502 此篇专门针对于学习群中部分小伙伴…

第三十三讲:tapestry表单组件详解之Label

2019独角兽企业重金招聘Python工程师标准>>> http://flywind.org/newtechnologydetail/168 转载于:https://my.oschina.net/flywind/blog/82633

c语言基础回顾 —— 其他知识点

参考&#xff1a;c语言基础回顾 —— 其他知识点 作者&#xff1a;丶PURSUING 发布时间&#xff1a; 2021-03-11 14:48:59 网址&#xff1a;https://blog.csdn.net/weixin_44742824/article/details/114666007 本文为学习笔记&#xff0c;结合课程内容以及下列文章 在 printf 里…

WebFlux02 SpringBoot WebFlux项目骨架搭建

1 环境搭建 1.1 版本说明 jdk -> 1.8 maven -3.5 springboot -> 2.0.3 开发工具 -> IDEA 1.2 创建项目 利用 IDEA 或者 start.spring.io 创建一个SpringBoot项目 1.2.1 选择依赖 1.2.2 pom.xml 依赖 <?xml version"1.0" encoding"UTF-8"?&g…

计算机专业 拒绝清华,高分拒绝清华北大怎么回事 为什么会拒绝

原标题&#xff1a;高分拒绝清华北大怎么回事 为什么会拒绝今年有一位来自云南的考生在高考的时候考了712分&#xff0c;成功超过清华北大的投档线&#xff0c;要是换做别人都应该会很高兴&#xff0c;终于能够上万人瞩目的名牌大学了&#xff0c;但是这位学生却拒绝了北大清华…

五大板块(1)—— 数组的定义,赋值与应用

参考&#xff1a;五大板块&#xff08;1&#xff09;—— 数组的定义&#xff0c;赋值与应用 作者&#xff1a;丶PURSUING 发布时间&#xff1a; 2021-03-18 16:00:05 网址&#xff1a;https://blog.csdn.net/weixin_44742824/article/details/114981166 目录数组的定义及访问完…

五大板块(2)—— 指针

参考&#xff1a;五大板块&#xff08;2&#xff09;—— 指针 作者&#xff1a;丶PURSUING 发布时间&#xff1a; 2021-03-18 16:01:22 网址&#xff1a;https://blog.csdn.net/weixin_44742824/article/details/114981482 本文为学习笔记&#xff0c;整合课程内容及文章如下&…

台式计算机机箱都一样吗,别以为组装台式机很简单,机箱选择大有学问

原标题&#xff1a;别以为组装台式机很简单&#xff0c;机箱选择大有学问曾经组装台式机的时候对于机箱完全没有在意&#xff0c;总觉得随便选择一款就可以了&#xff0c; 而且是挑便宜的选择&#xff0c;而那些机箱有便宜也有贵&#xff0c;其实里面的设计完全不一样&#xff…

实现连麦_微信年底放了个大招,视频号重磅升级,打赏直播连麦美颜抽奖齐上...

期待已久的视频号连麦功能来了。这次来的不仅有连麦功能&#xff0c;还有视频号打赏的微信豆体系&#xff0c;创作者想要的入口也有了。让我们一起来看看有什么新功能吧&#xff01;太长不看版本&#xff1a;「附近的人」变「附近的直播和人」连麦上线&#xff0c;还有美颜、抽…

【转】 .NET 打印水晶报表(CrystalReport)时,出现“查询引擎错误 C:/DO...

2019独角兽企业重金招聘Python工程师标准>>> 本地开发环境&#xff1a; Win XP, Visual Studio 2003 Oracle 项目背景&#xff1a; WinForm 工程&#xff0c;在一个表单中用Treeview控件显示 部门层级信息&#xff0c;然后有 按照相同格式&#xff08;layout…

html5 查看图片,html5实现图片预览和查看原图

一、页面元素只有三个简单元素&#xff1a;拖拽区域二、添加简单的样式&#xff1a;.dragarea{width:300px;height:100px;background:#ddd;text-align:center;line-height:100px;}.drag_hover{background:rgba(0,0,0,.4) !important;}.item{width:300px;height:100px;float:lef…

五大板块(4)——链表

参考&#xff1a;五大板块&#xff08;4&#xff09;——链表 作者&#xff1a;丶PURSUING 发布时间&#xff1a; 2021-02-15 09:33:29 网址&#xff1a;https://blog.csdn.net/weixin_44742824/article/details/114981905 目录一、对比链表与数组同样是存放一串数据&#xff0…

boolean类型默认值_「软帝学院」Java的基本数据类型

Java的基本数据类型Java的两大数据类型: 内置数据类型 引用数据类型内置数据类型Java语言提供了八种基本类型。六种数字类型(四个整数型&#xff0c;两个浮点型)&#xff0c;一种字符类型&#xff0c;还有一种布尔型。byte&#xff1a; byte数据类型是8位、有符号的&#xff0c…

五大板块(5)——字符串

参考&#xff1a;五大板块&#xff08;5&#xff09;——字符串 作者&#xff1a;丶PURSUING 发布时间&#xff1a; 2021-03-18 16:03:48 网址&#xff1a;https://blog.csdn.net/weixin_44742824/article/details/114982019 目录一、字符串的定义方式与输出二、字符串的结尾是…

哈尔滨阳光计算机学院是不是黄了,黑龙江这4所野鸡大学,常被误认为是名校,实则害人不浅...

在高考中拿到高分进入心仪的大学&#xff0c;几乎是所有高三党奋斗努力的目标。但并不是所有的考生都能得偿所愿&#xff0c;没有取得高分&#xff0c;想进入好大学&#xff0c;但是又不想复读再经历一次高三的磨砺。如果此时你收到了录取通知书或者电话&#xff0c;告知你被一…

android 打开支付宝扫码页_Chrome 85正式版发布:新增标签页分组功,网页多了也不乱...

IT服务圈儿有温度、有态度的IT自媒体平台文章转载自 OSCHINA 社区[http://www.oschina.net]原文标题&#xff1a;Chrome 85 稳定版发布&#xff0c;页面加载速度提升 10%谷歌今日发布了最新稳定版 Chrome 85。此版本将页面加载速度提高了 10%&#xff0c;并带来了许多标签页方面…

Windows使用技巧

摘自&#xff1a;这些技巧让你windows用起来很爽 —— 小工具&#xff0c;小技巧&#xff0c;删小广告&#xff0c;重装卸载残留 作者&#xff1a;丶PURSUING 发布时间&#xff1a; 2021-03-12 16:09:17 网址&#xff1a;https://blog.csdn.net/weixin_44742824/article/detail…

iOS开发缓存机制之—内存缓存机制

在IOS应用程序开发中&#xff0c;为了减少与服务端的交互次数&#xff0c;加快用户的响应速度&#xff0c;一般都会在iOS设备中加一个缓存的机制。这篇文章将介绍一下如何在iOS设备中进行缓存&#xff0c;本文先介绍一下将内容缓存到内存中&#xff0c;下一篇文章就介绍一下在i…