02、react 之创建一个虚拟的节点并使用

来源：互联网发布：系统动力学仿真软件编辑：程序博客网时间：2024/05/22 03:29

注意事项：
1、type类型 type="text/babel" <script type="text/babel"> </script>
2、首字母必须大写
3、调用组件的时候必须使用<HelloWorld />格式来写
4、引用browser.js

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <meta http-equiv="X-UA-Compatible" content="ie=edge">    <title>Hello React</title>    <!-- react：React的核心组件，第一个加载 -->    <script src="js/react.min.js"></script>    <!-- react-dom：ReactDOM对DOM节点的一些操作 -->    <script src="js/react-dom.min.js"></script>    <!--browser：将JSX语法转换成javascript语法-->    <script src="js/browser.js"></script></head><body>    <div id="app"></div>   <!--    注意事项：        1、type类型       type="text/babel"        2、首字母必须大写        3、调用组件的时候必须使用<HelloWorld />格式来写        4、引用browser.js    -->    <script type="text/babel">        // 创建react的虚拟的节点        // 创建的是一个组件        // 首字母必须大写        var HelloWorld = React.createClass({            render:function () {                return <h1>Hello World</h1>            }        })        // 调用组件的时候必须使用<HelloWorld />格式来写        ReactDOM.render(<HelloWorld></HelloWorld>,document.getElementById("app"))    </script></body></html>

阅读全文

0 0