码迷,mamicode.com
首页 > Web开发 > 详细

ReactJs入门---编写Hello World

时间:2016-04-25 19:20:35      阅读:186      评论:0      收藏:0      [点我收藏+]

标签:

  React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站。做出来以后,发现这套东西很好用,就在2013年5月开源了。由于 React 的设计思想极其独特,属于革命性创新,性能出众,代码逻辑却非常简单。所以,越来越多的人开始关注和使用,认为它可能是将来 Web 开发的主流工具。

  下面写一个React入门的小案例--Hello World

  ReactJs下载非常简单,为了方便大家下载,这里再一次给出下载地址(链接),下载完成后,我么看到的是一个压缩包。解压后,我们新建一个html文件,引用react.js和JSXTransformer.js这两个js文件。html模板如下(js路径改成自己的):

                                                                 技术分享

  这里大家可能会奇怪,为什么script的type是text/jsx,这是因为 React 独有的 JSX 语法,跟 JavaScript 不兼容凡是使用 JSX 的地方,都要加上 type="text/jsx" 。 其次,React 提供两个库: react.js 和 JSXTransformer.js ,它们必须首先加载。其中,JSXTransformer.js 的作用是将 JSX 语法转为 JavaScript 语法。这一步很消耗时间,实际上线的时候,应该将它放到服务器完成。

  下面我们就可以编写js代码了

                                                         技术分享

  React.render 是 React 的最基本方法,用于将模板转为 HTML 语言,并插入指定的 DOM 节点。

 

  这样我们就可以在浏览器中看见Hello,World!了,这里需要注意的是:某些浏览器(如,Chrome浏览器)将无法加载该文件,除非它通过HTTP服务。

    到这里,恭喜,你已经步入了ReactJS的大门~~

ReactJs入门---编写Hello World

标签:

原文地址:http://www.cnblogs.com/ashenra/p/5431884.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!