A top-level App
component returns <Button />
from its render()
method.
-
What is the relationship between
<Button />
andthis
in thatButton
’srender()
? -
Does rendering
<Button><Icon /></Button>
guarantee that anIcon
mounts? -
Can the
App
change anything in theButton
output? 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.