上一篇:《react app流程原理》


《react 必备知识点》

作者 vhaixingv 创建于 19-03-05 10:52:53

React 是一个用于构建用户界面的 JAVASCRIPT 库

React主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图)。

高效 −React通过对DOM的模拟,最大限度地减少与DOM的交互

JSX − JSX 是 JavaScript 语法的扩展。React 开发不一定使用 JSX ,但我们建议使用它。

单向响应的数据流 − 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>



注意: 在浏览器中使用 Babel 来编译 JSX 效率是非常低的。


---------------------------------------------


import React, { Component } from 'react';

import logo from './logo.svg';import './App.css';

class App extends Component {  render() {    return (      <div className="App">        <div className="App-header">          <img src={logo} className="App-logo" alt="logo" />          <h2>欢迎来到菜鸟教程</h2>        </div>        <p className="App-intro">          你可以在 <code>src/App.js</code> 文件中修改。        </p>      </div>    

    );

  }

} export default App;


下一篇:《苹果macbook连接服务器SSH FTP SFTP的使用方法》