reactjs/Ejercicio2.html at master · wcabrera/reactjs · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<!DOCTYPE html>
<html>

  <head>

    <script src="http://fb.me/react-with-addons-0.12.0.js"></script>
    <script src="http://fb.me/JSXTransformer-0.12.0.js"></script>

  </head>

  <body>

    <div id="ejemplo"></div>
    <div id="ejemplo2"></div>
    <div id="ejemplo3"></div>
    <div id="ejemplo4"></div>

    <script type="text/jsx">

     var Componente = React.createClass({
          render:function(){
            return (<h1>T&iacute;tulo</h1>);
          }
     });
     var Componente2 = React.createClass({
          render:function(){
            return (<div>Segundo Componente</div>);
          }
    });
     var Componente3 = React.createClass({
        render:function(){
          return React.DOM.div({children:[React.DOM.span({children:"Ejemplo 3"}),React.DOM.span({children:"El mismo ejemplo 3"})]})
        }

     });
    var Componente4= React.createClass({
      render:function(){
        return React.DOM.div({
            children:"Este es el ejemplo 4"

        })


      }

    })
  React.renderComponent(<Componente/>,document.getElementById('ejemplo'));
  React.renderComponent(<Componente2/>,document.getElementById('ejemplo2'));
  React.renderComponent(Componente3({}),document.getElementById('ejemplo3'));
  React.renderComponent(Componente4({}),document.getElementById('ejemplo4'));

  </script>
  </body>
</html>