diff --git a/docs/02.1-jsx-in-depth.md b/docs/02.1-jsx-in-depth.md index 43ce01c5..1f69e765 100644 --- a/docs/02.1-jsx-in-depth.md +++ b/docs/02.1-jsx-in-depth.md @@ -138,7 +138,7 @@ var tree = Nav(null, React.DOM.span(null)); 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: ```javascript -var Form = Form; +var Form = MyFormComponent; var FormRow = Form.Row; var FormLabel = Form.Label; var FormInput = Form.Input; @@ -156,7 +156,7 @@ var App = ( Instead of declare a bunch of variables at the top, you'll get just one component that have other components as attributes. ```javascript -var Form = Form; +var Form = MyFormComponent; var App = (
@@ -171,11 +171,11 @@ var App = ( For doing this, you just need to create your *"sub-components"* as attributes of the main component: ```javascript -var Form = React.createClass({ ... }); +var MyFormComponent = React.createClass({ ... }); -Form.Row = React.createClass({ ... }); -Form.Label = React.createClass({ ... }); -Form.Input = React.createClass({ ... }); +MyFormComponent.Row = React.createClass({ ... }); +MyFormComponent.Label = React.createClass({ ... }); +MyFormComponent.Input = React.createClass({ ... }); ``` JSX will take care to make the things right when compile your code.