change the global variable to a new sample component
Pedro Nauck committed
Oct 7, 2014 at 13:06 UTC
fd9ddab532793cce38c231becad113dedd5c47b4
1 file changed
+6
-6
docs/docs/02.1-jsx-in-depth.md
+6
-6
@@ -138,7 +138,7 @@ var tree = Nav(null, React.DOM.span(null));
138
If you are building a component that have a lot of childrens, or if you are building your application with some categories of reusable components (like a `Form` category), to make more simple and easiest, you can use a *namespaced component* to avoid something like this:
139
140
```javascript
141
-var Form = Form;
141
+var Form = MyFormComponent;
142
var FormRow = Form.Row;
143
var FormLabel = Form.Label;
144
var FormInput = Form.Input;
@@ -156,7 +156,7 @@ var App = (
156
Instead of declare a bunch of variables at the top, you'll get just one component that have other components as attributes.
157
158
```javascript
159
-var Form = Form;
159
+var Form = MyFormComponent;
160
161
var App = (
162
<Form>
@@ -171,11 +171,11 @@ var App = (
171
For doing this, you just need to create your *"sub-components"* as attributes of the main component:
172
173
```javascript
174
-var Form = React.createClass({ ... });
174
+var MyFormComponent = React.createClass({ ... });
175
176
-Form.Row = React.createClass({ ... });
177
-Form.Label = React.createClass({ ... });
178
-Form.Input = React.createClass({ ... });
176
+MyFormComponent.Row = React.createClass({ ... });
177
+MyFormComponent.Label = React.createClass({ ... });
178
+MyFormComponent.Input = React.createClass({ ... });
179
```
180
181
JSX will take care to make the things right when compile your code.