A top-level App component returns <Button /> from its render() method.
-
What is the relationship between
<Button />andthisin thatButton’srender()? -
Does rendering
<Button><Icon /></Button>guarantee that anIconmounts? -
Can the
Appchange anything in theButtonoutput? What and how?
1.Q- What is the relationship between and this in that Button’s render()?
1.A- '< Button />' == React.createElement('Button'). Button is created with React.createClass which expects object specification. In those object specification there is render method and this points to that object instance. React.createElement('Button') or '< Button />' creates new instance of that type. So the this in Button's render method is almost the '< Button />' but not exactly. The '< Button />' instance is created via React and not native Object.create().
2.Q- Does rendering
guarantee that an Icon mounts?2.A- Never. Button may choose to not render it's children.
3.Q- Can the App change anything in the Button output? What and how?
3.A- One way is directly via props. Button also may be connected to some store on which App is connected. Also it can change it directly through passing different children to Button.