amirho/react.dev
1
0
Fork 0
mirror of https://github.com/reactjs/react.dev.git synced 2026-02-24 04:33:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update tutorial.md

Browse Source
This commit is contained in:
Preston Parry
2015-02-05 22:57:36 -08:00
parent 302fd73793
commit 809c13e552
1 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
docs/tutorial.md
View File

@@ -168,7 +168,7 @@ Notice how we're mixing HTML tags and components we've built. HTML components ar
### Using props
Let's create the Comment component. Using **props** we will be able to read the data passed to it from the `CommentList`, and render some markup:
Let's create the `Comment` component, which will depend on data passed in from it's parent. Data passed in from a parent component is available as a 'property' on the child component. These 'properties' are accessed through `this.props`. Using props we will be able to read the data passed to the `Comment` from the `CommentList`, and render some markup:
```javascript
// tutorial4.js
@@ -190,7 +190,7 @@ By surrounding a JavaScript expression in braces inside JSX (as either an attrib
### Component Properties
Let's create our third component, `Comment`. We will want to pass it the author name and comment text so we can reuse the same code for each unique comment. First let's add some comments to the `CommentList`:
Now that we have defined the `Comment` component, we will want to pass it the author name and comment text. This allows us to reuse the same code for each unique comment. Now let's add some comments within our `CommentList`:
```javascript{6-7}
// tutorial5.js
@@ -206,7 +206,7 @@ var CommentList = React.createClass({
});
```
Note that we have passed some data from the parent `CommentList` component to the child `Comment` components. For example, we passed *Pete Hunt* (via an attribute) and *This is one comment* (via an XML-like child node) to the first `Comment`. Data passed from parent to children components is called **props**, short for properties.
Note that we have passed some data from the parent `CommentList` component to the child `Comment` components. For example, we passed *Pete Hunt* (via an attribute) and *This is one comment* (via an XML-like child node) to the first `Comment`. As noted above, the `Comment` component will access these 'properties' through `this.props.author`, and `this.props.children`.
### Adding Markdown