Merge pull request #1761 from hankeypancake/update-keys-docs

Improve keys example
This commit is contained in:
Isiah Meadows 2017-03-30 15:52:02 -04:00 committed by GitHub
commit cc5d7c4270

View file

@ -96,21 +96,21 @@ users.map(function(u) {
#### Avoid hiding keys in component root elements #### Avoid hiding keys in component root elements
If you refactor the code and put the button inside a component, the key must be moved out of the component and placed back where the component took the place of the button. If you refactor the code and make a user component, the key must be moved out of the component and put on the component itself, since it is now the immediate child of the array.
```javascript ```javascript
// AVOID // AVOID
var Button = { var User = {
view: function(vnode) { view: function(vnode) {
return m("button", {key: vnode.attrs.id}, u.name) return m("div", { key: vnode.attrs.user.id }, [
m(Button, vnode.attrs.user.name)
])
} }
} }
// PREFER // PREFER
users.map(function(u) { users.map(function(u) {
return m("div", [ return m(User, { key: u.id, user: u }) // key should be here, not in component
m(Button, {key: u.id}, u.name) // key should be here, not in component
])
}) })
``` ```