Commit dc11c04

committed

differentiate names of props and iterated var in intro's component example

1 parent 0e2023b commit dc11c04Copy full SHA for dc11c04

File tree

1 file changed

+14

-17

lines changed

src/v2/guide
- index.md

1 file changed

+14

-17

lines changed

`‎src/v2/guide/index.md‎`

Lines changed: 14 additions & 17 deletions

Original file line number	Diff line number	Diff line change
`@@ -271,9 +271,7 @@ Now you can compose it in another component's template:`
`271`	`271`
`272`	`272`	``` html
`273`	`273`	`<ul>`
`274`		`- <!--`
`275`		`- Create an instance of the todo-item component`
`276`		`- -->`
	`274`	`+ <!-- Create an instance of the todo-item component -->`
`277`	`275`	`<todo-item></todo-item>`
`278`	`276`	`</ul>`
`279`	`277`	```
@@ -295,11 +293,9 @@ Now we can pass the todo into each repeated component using `v-bind`:
`295`	`293`	``` html
`296`	`294`	`<div id="app-7">`
`297`	`295`	`<ol>`
`298`		`- <!--`
`299`		`- Now we provide each todo-item with the todo object`
`300`		`- it's representing, so that its content can be dynamic`
`301`		`- -->`
`302`		`- <todo-item v-for="todo in todos" v-bind:todo="todo"></todo-item>`
	`296`	`+ <!-- Now we provide each todo-item with the todo object -->`
	`297`	`+ <!-- it's representing, so that its content can be dynamic -->`
	`298`	`+ <todo-item v-for="item in groceryList" v-bind:todo="item"></todo-item>`
`303`	`299`	`</ol>`
`304`	`300`	`</div>`
`305`	`301`	```
`@@ -308,21 +304,22 @@ Vue.component('todo-item', {`
`308`	`304`	`props: ['todo'],`
`309`	`305`	`template: '<li>{{ todo.text }}</li>'`
`310`	`306`	`})`
	`307`	`+`
`311`	`308`	`var app7 = new Vue({`
`312`	`309`	`el: '#app-7',`
`313`	`310`	`data: {`
`314`		`- todos: [`
`315`		`- { text: 'Learn JavaScript' },`
`316`		`- { text: 'Learn Vue' },`
`317`		`- { text: 'Build something awesome' }`
	`311`	`+ groceryList: [`
	`312`	`+ { text: 'Vegetables' },`
	`313`	`+ { text: 'Cheese' },`
	`314`	`+ { text: 'Whatever else humans are supposed to eat' }`
`318`	`315`	`]`
`319`	`316`	`}`
`320`	`317`	`})`
`321`	`318`	```
`322`	`319`	`{% raw %}`
`323`	`320`	`<div id="app-7" class="demo">`
`324`	`321`	`<ol>`
`325`		`- <todo-item v-for="todo in todos" v-bind:todo="todo"></todo-item>`
	`322`	`+ <todo-item v-for="item in groceryList" v-bind:todo="item"></todo-item>`
`326`	`323`	`</ol>`
`327`	`324`	`</div>`
`328`	`325`	`<script>`
`@@ -333,10 +330,10 @@ Vue.component('todo-item', {`
`333`	`330`	`var app7 = new Vue({`
`334`	`331`	`el: '#app-7',`
`335`	`332`	`data: {`
`336`		`- todos: [`
`337`		`- { text: 'Learn JavaScript' },`
`338`		`- { text: 'Learn Vue' },`
`339`		`- { text: 'Build something awesome' }`
	`333`	`+ groceryList: [`
	`334`	`+ { text: 'Vegetables' },`
	`335`	`+ { text: 'Cheese' },`
	`336`	`+ { text: 'Whatever else humans are supposed to eat' }`
`340`	`337`	`]`
`341`	`338`	`}`
`342`	`339`	`})`

0 commit comments

Comments

(0)

Navigation Menu

Search code, repositories, users, issues, pull requests...

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Commit dc11c04

File tree

1 file changed

1 file changed

`‎src/v2/guide/index.md‎`

0 commit comments