How to use components?

[pradeeproark]

Lets say we have a component like below

var circlecompo = React.createClass({
    componentWillMount: function() {
        console.log('mount c');  
    },
    render: function(){
      return (
          <circle fill={0xFFFF0B} fillAlpha={0.5}
                  x={470} y={200} diameter={200}/>
      );
    }
});

and a

var MyGame = React.createClass({
render: function() {
return(
<game>
<circlecompo/>
</game>)
});

This doesn't work. There are no errors but the circle is not rendered. What is missing?

[evilfer]

Two possible reasons:

• the game tag should have 'width' and 'height' porps,
• make sure 'circlecompo' is defined within the scope that creates MyGame, otherwise it'll be treated as a string not matching any react-phaser tag, and will be ignored.

[pradeeproark]

I omitted the width and height in the issue description by mistake.

It was actually because the component name should be capital cased.

Ex: https://gist.github.com/anonymous/2773f909e0e9d90fa1385faee21aad3d

Works.