In the "React Chinese Reference Manual", React is a JAVASCRIPT library used to build user interfaces. React is mainly used to build UI. Many people think of React as the V (view) in MVC. React originated as an internal project at Facebook to build the Instagram website and was open sourced in May 2013. React has high performance and very simple code logic. More and more people have begun to pay attention to and use it.
React(有时叫React.js或ReactJS)是一个为数据提供渲染为HTML视图的开源JavaScript 库。React视图通常采用包含以自定义HTML标记规定的其他组件的组件渲染。
React为程序员提供了一种子组件不能直接影响外层组件("data flows down")的模型,数据改变时对HTML文档的有效更新,和现代单页应用中组件之间干净的分离。
React由Facebook 的软件工程师Jordan Walke创建。他受到PHP的HTML组件框架XHP影响。该框架首先于2011年部署于Facebook的 newsfeed,随后于2012年部署于Instagram。它于2013年5月在JSConf US开源。
提示:在开始学习 React 之前,您需要具备HTML5、CSS、JavaScript的基础知识。
下面让我们感受第一个react实例!
第一个react实例
实例
<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Hello React!</title> <script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script> <script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script> <script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script> </head> <body> <div id="example"></div> <script type="text/babel"> ReactDOM.render( <h1>Hello, world!</h1>, document.getElementById('example') ); </script> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
由于 React的设计思想极其独特,属于革命性创新,性能出众,代码逻辑却非常简单。所以,越来越多的人开始关注和使用,认为它可能是将来 Web 开发的主流工具。
提示:我们的React教程将帮助您逐步学习如何掌握并应用React,如果你有任何疑问,请前往PHP中文网React社区提出你的问题,会有热心网友为你解答。
React特点:
声明式设计:React采用声明范式,可以轻松描述应用。
高效:React通过对DOM的模拟,最大限度地减少与DOM的交互。
灵活:React可以与已知的库或框架很好地配合。
本React教程手册涵盖的内容
本React教程手册涵盖所有React基础使用方法,包含React安装、React元素渲染、React JSX、React组件、React Props、React AJAX、React实践处理等等知识。
提示:本教程的每一章都包含了很多React实例,您可以直接点击 "运行实例" 按钮在线查看结果。这些例子将帮助您更好地理解和使用React。
Latest chapter
- React Refs 2016-10-19
- React 表单与事件 2016-10-19
- React AJAX 2016-10-19
- React 组件生命周期 2016-10-19
- React 组件 API 2016-10-19
- React Props 2016-10-19
- React State(状态) 2016-10-19
- React 组件 2016-10-19
Related courses
- Quick introduction to web front-end development 2021-12-10
- The front-end course that understands you best: HTML5/CSS3/ES6/NPM/Vue/...[Original] 2022-09-30
- Gulp Getting Started Video Tutorial 2022-04-18
- Brothers in Arms Gao Luofeng CSS3 video tutorial 2022-04-20
- AngularJS development web application basic example video tutorial 2022-04-18
- Ajax full contact 2022-04-13
- MUI framework basic video tutorial 2022-04-13
- Online training class trial class 2019-01-10