React的第一个例子
准备:
官网:https://facebook.github.io/react/downloads.html
Github地址:https://github.com/facebook/react
首先需要引入的3个库:
react.js 是 React 的核心库,
react-dom.js 是提供与 DOM 相关的功能,
browser.min.js 的作用是将 JSX 语法转为 JavaScript 语法
而且凡是使用 JSX 的地方,script都要加上 type="text/babel"
第一个实例:
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8" />
<title>Hello React</title>
<script src="build/react.js"></script>
<script src="build/react-dom.js"></script>
<script src="build/browser.min.js"></script>
</head> <body>
<div id="example"></div>
<script type="text/babel">
// ** Your code goes here! **
ReactDOM.render(
<h1>Hello, world!</h1>, document.getElementById('example')
);
</script>
</body> </html>
效果:
React的第一个例子的更多相关文章
- react实战系列 —— react 的第一个组件
react 的第一个组件 写了 react 有一个半月,现在又有半个月没写了,感觉对其仍旧比较陌生. 本文分两部分,首先聊一下 react 的相关概念,然后不使用任何语法糖(包括 jsx)或可能隐藏底 ...
- ElasticSearch 5学习(5)——第一个例子(很实用)
想要知道ElasticSearch是如何使用的,最快的方式就是通过一个简单的例子,第一个例子将会包括基本概念如索引.搜索.和聚合等,需求是关于公司管理员工的一些业务. 员工文档索引 业务首先需要存储员 ...
- MXNet学习~第一个例子~跑MNIST
反正基本上是给自己看的,直接贴写过注释后的代码,可能有的地方理解不对,你多担待,看到了也提出来(基本上对未来的自己说的),三层跑到了97%,毕竟是第一个例子,主要就是用来理解MXNet怎么使用. #导 ...
- emberjs学习一(环境和第一个例子)
code { margin: 0; padding: 0; white-space: pre; border: none; background: transparent; } code, pre t ...
- Qt之QCustomPlot绘图(一)配置和第一个例子
最近一个用Qt开发的项目需要绘制坐标曲线,我在老师的指点下使用了QCustomPlot这个插件,使用方法简单,功能还算不错. 可是在网上找了很多资料和博文都只是将官方提供的例子演示一遍,没有系统全面的 ...
- 键盘过滤第一个例子ctrl2cap(4.1~4.4)汇总,测试
键盘过滤第一个例子ctrl2cap(4.1~4.4)汇总,测试 完整源代码 /// /// @file ctrl2cap.c /// @author wowocock /// @date 2009-1 ...
- springmvc的介绍和第一个例子
SpringMVC是Spring 框架自带的一部分. SpringMVC底层基于:Servlet Struts2底层基于:filter struts1底层基于:Servlet spring 各模块 我 ...
- 04springMVC结构,mvc模式,spring-mvc流程,spring-mvc的第一个例子,三种handlerMapping,几种控制器,springmvc基于注解的开发,文件上传,拦截器,s
1. Spring-mvc介绍 1.1市面上流行的框架 Struts2(比较多) Springmvc(比较多而且属于上升的趋势) Struts1(即将被淘汰) 其他 1.2 spring-mv ...
- mapReducer第一个例子WordCount
mapreducer第一个例子,主要是统计一个目录下各个文件中各个单词出现的次数. mapper package com.mapreduce.wordCount; import java.io.IOE ...
随机推荐
- HDU 17111 Number Sequence(KMP裸题)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1711 题目大意:给你两个数字数组a和b,若b是a的子序列则输出b在a中第一次出现的位置,否则输出-1. ...
- Quartz任务调度入门
Quartz任务调度入门 了解Quartz体系结构Quartz对任务调度的领域问题进行了高度的抽象,提出了调度器.任务和触发器这3个核心的概念,并在org.quartz通过接口和类对重要的这些核心概念 ...
- Jquery 实现轮播图
jq 轮播图 function banner_show(){ var left_btn = $("#banner_tag_left"); //获取左侧单击按钮 var right_ ...
- 一次压力测试Loadrunner经验分享
一次压力测试Loadrunner经验分享 http://blog.csdn.net/lxlmj/article/category/553431 loadrunner测试socketstcpserver ...
- LCA:Tarjan算法实现
本博文转自http://www.cnblogs.com/JVxie/p/4854719.html,转载请注明出处 首先是最近公共祖先的概念(什么是最近公共祖先?): 在一棵没有环的树上,每个节点肯定有 ...
- Python编程举例-iter和next结合定制可迭代对象
class Foo: def __init__(self,n): self.n = n def __iter__(self): return self def __next__(self): if s ...
- JMS 基本可靠性机制 和 事务机制
4.3.1 基本可靠性机制4.3.1.1 控制消息的签收(Acknowledgment) 客户端成功接收一条消息的标志是这条消息被签收.成功接收一条消息一般包括如 下三个阶段:1.客户端接收消息:2. ...
- hihoCoder #1695 公平分队II
题目大意 Alice 和 Bob 在玩一个游戏.Alice 将 $1$ 到 $2n$ 这 $2n$ 个整数分成两组,每组 $n$ 个.Bob 从中选一组,剩下一组归 Alice.Alice 可以与 B ...
- 【随机化】【并查集】Gym - 100851J - Jump
题意:交互题,有一个长度为n(偶数)的二进制串,你需要猜不超过n+500次猜到它.如果你猜的串与原串相同的位数为n,那么会返回n,如果为n/2,那么会返回n/2,否则都会返回零. 先random,直到 ...
- python3-开发进阶Flask的基础(4)
今日内容: 上下文管理:LocalProxy对象 上下文管理: 请求上下文: request/session app上下文:app/g 第三方组件:wtforms 1.使用 ...