标签：extend dom reac ext element javascrip doc one asi
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>03_componment_basic</title> </head> <body> <div id="example1"></div> <div id="example2"></div> <script type="text/javascript" src="../js/react.development.js"></script> <script type="text/javascript" src="../js/react-dom.development.js"></script> <script type="text/javascript" src="../js/babel.min.js"></script> <script type="text/babel"> //一、.定义组件 //方式1:工厂函数组件(简单组件) function MyComponent() { return <h2>工厂函数组件(简单组件)</h2> } //方式2:es6类组件(复杂组件)(通过创建MyComponent2的实例调用render方法) class MyComponent2 extends React.Component { render() { return <h2>es6类组件(复杂组件)</h2> } } //二、渲染组件标签 ReactDOM.render(<MyComponent/>, document.getElementById(‘example1‘)); ReactDOM.render(<MyComponent2/>, document.getElementById(‘example2‘)); </script> </body> </html>
标签：extend dom reac ext element javascrip doc one asi
原文地址：https://www.cnblogs.com/zhanzhuang/p/10703426.html
