最火的React框架

最新推荐文章于 2025-04-27 20:22:15 发布

iteye_9424

最新推荐文章于 2025-04-27 20:22:15 发布

阅读量307

点赞数

文章标签： React

本文链接：https://blog.youkuaiyun.com/iteye_9424/article/details/82646152

版权

在IT行业现在最火的框架，毋庸置疑的是React框架。

由于React设计独特，性能出众，代码逻辑却非常简单，被越来越多的人关注和学习，认为它将来可能成为Web开发的主要框架。

React为了更高超的性能而使用虚拟DOM作为其不同的实现，它同时也可以由服务器Node.js渲染-而不需要过重的浏览器DOM支持。DOM是节点树的HTML，虚拟的DOM是存在于内存之中的一种数据结构。

React有三个库：react.js ,react-dom.js和Browser.js,它们必须首先加载。react.js是React的核心库，react-dom.js是提供与DOM相关的功能，Browser.js的作用是将JSX语法转为JavaScript语法。React独有JSX语法，跟JavaScript不兼容，凡是使用JSX的地方，都要<script>标签的type属性为"text/bable".

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

<!DOCTYPE html>
<html>
  <head>
    <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">
  ReactDOM.render(
  <h1>Hello, world!</h1>,
  document.getElementById('example')
);
    </script>
  </body>
</html>

React允许将代码封装成组件，然后像普通的HTML标签一样，在网页中插入这个组件。React.creactClass方法就用于生成一个组件类。

<!DOCTYPE html>
<html>
  <head>
    <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">
    var HelloMessage = React.createClass({
  render: function() {
    return <h1>
      Hello {this.props.name}
    </h1><p>
      some text
    </p>;
  }
});
ReactDOM.render(
  <HelloMessage/>,
  document.getElementById('example')
);
    </script>
  </body>
</html>