React 基本概念

React介绍

React 起源于 Facebook 的内部项目,React 用于构建用户界面的JavaScript库

React 文档

英文文档: https://reactjs.org
中文文档: https://doc.react-china.org/
gitHub地址:https://github.com/facebook/react

React 特点

声明式:React 可以非常轻松地创建用户交互界面。为你应用的每一个状态设计简洁的视图,在数据改变时 React 也可以高效地更新渲染界面。
组件化:创建好拥有各自状态的组件,再由组件构成更加复杂的界面。
一次学习,随处编写:无论你现在正在使用什么技术栈,你都可以随时引入 React 开发新特性。
React 也可以用作开发原生应用的框架[React Native]
(https://facebook.github.io/react-native/ )

React 优势

  • 使用组件化开发方式,符合现代Web开发的趋势
  • 技术成熟,社区完善,配件齐全,适用于大型Web项目(生态系统健全)
  • 由Facebook专门的团队维护,技术支持可靠
  • ReactNative - Learn once, write anywhere: Build mobile apps with React
  • 使用方式简单,性能非常高,支持服务端渲染 SSR
  • React非常火,从技术角度,可以满足好奇心,提高技术水平;从职业角度,有利于求职和晋升,有利于参与潜力大的项目

React入门实例

<div id="app"></div>
<!-- 引包 -->
<script src="./react.development.js"></script>
<script src="./react-dom.development.js"></script>
<script src="./babel.min.js"></script>
  <script type="text/babel">
    // 2. 创建了一个react对象
    // <div id="box" title="哈哈">我是内容</div>
    // 表示创建一个react对象
    // 参数1:创建什么类型的对象,标签的名字
    // 参数2:创建的元素的属性有哪些  对象
    // 参数3:创建的react对象的内容(子元素)
    // 返回值: 就是一个react对象
    let element = React.createElement('div', {id: 'box', title: '我是react'}, '我是内容')
    //3. 把react对象渲染到页面
    // 参数1: react对象
    // 参数2: 渲染到页面中的DOM容器
    ReactDOM.render(element, document.getElementById('app'))
  </script>
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容