首先来配置一下React的环境,在网上下载react.js和react-dom.js和browser.min.js,其中react.js是react的核心库,react-dom.js是提供与Dom相关的功能,browser.min.js是负责将JSX转换为javascript。
JSX:javascript XML,看起来就像是在javascript中直接写了XML,直接使用javascript可以吗?是可以的,那为什么要用JSX语法呢?举个例子,对比一下你就会发现了:
//使用JSX React.render( <div> <div> <div>content</div> </div> </div>,document.getElementById('example') ); //不使用JSX React.render( React.createElement('div',null,React.createElement('div','content') ) ),document.getElementById('example') );1.Hello World(入门必备啊)
<!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>效果展示: