Site icon Init HTML

React: Rendering Multiple Components

Mã nguồn tham khảo:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>Component</title>
    <script src="https://npmcdn.com/react@15.3.0/dist/react.min.js"></script>
    <script src="https://npmcdn.com/react-dom@15.3.0/dist/react-dom.min.js"></script>
    <script src="https://npmcdn.com/babel-core@5.8.38/browser.min.js"></script>
</head>
<body>
    <div id="example"></div>
    <div id="example-2"></div>

    <script type="text/babel">
        var Barcon = React.createClass({
            render: function() {
                return (
                    <div>
                        <h3>This is a simple component!</h3>
                        <p>This is content.</p>
                    </div>
                );
            }
        });

        ReactDOM.render(<div><Barcon /><Barcon /><Barcon /></div>, document.getElementById('example')); // Multi Components
    </script>
</body>
</html>
Exit mobile version