Merge branch 'next'
This commit is contained in:
commit
4772055629
11 changed files with 261 additions and 64 deletions
|
|
@ -1,5 +1,6 @@
|
|||
# Change log
|
||||
|
||||
- [v1.1.1](#v111)
|
||||
- [v1.1.0](#v110)
|
||||
- [v1.0.1](#v101)
|
||||
- [Migrating from v0.2.x](#migrating-from-v02x)
|
||||
|
|
@ -7,12 +8,21 @@
|
|||
|
||||
---
|
||||
|
||||
### v1.1.1
|
||||
|
||||
#### Bug fixes
|
||||
|
||||
- hyperscript: Allow `0` as the second argument to `m()` - [#1752](https://github.com/lhorie/mithril.js/issues/#1752) / [#1753](https://github.com/lhorie/mithril.js/pull/#1753) ([@StephanHoyer](https://github.com/StephanHoyer))
|
||||
- hyperscript: restore `attrs.class` handling to what it was in v1.0.1 - [#1764](https://github.com/lhorie/mithril.js/issues/#1764) / [#1769](https://github.com/lhorie/mithril.js/pull/#1769)
|
||||
- documentation improvements ([@JAForbes](https://github.com/JAForbes), [@smuemd](https://github.com/smuemd), [@hankeypancake](https://github.com/hankeypancake))
|
||||
|
||||
### v1.1.0
|
||||
|
||||
#### News
|
||||
|
||||
- support for ES6 class components
|
||||
- support for closure components
|
||||
- improvements in build and release automation
|
||||
|
||||
#### Bug fixes
|
||||
|
||||
|
|
|
|||
|
|
@ -203,7 +203,7 @@ Vue | Mithril
|
|||
|
||||
Vue is heavily inspired by Angular and has many things that Angular does (e.g. directives, filters, bi-directional bindings, `v-cloak`), but also has things inspired by React (e.g. components). As of Vue 2.0, it's also possible to write templates using hyperscript/JSX syntax (in addition to single-file components and the various webpack-based language transpilation plugins). Vue provides both bi-directional data binding and an optional Redux-like state management library, but unlike Angular, it provides no style guide. The many-ways-of-doing-one-thing approach can cause architectural fragmentation in long-lived projects.
|
||||
|
||||
Mithril has far less concepts and typically organizes applications in terms of components and a data layer. There are no different ways of defining components, and thus there's no need to install different sets of tools to make different flavors work.
|
||||
Mithril has far less concepts and typically organizes applications in terms of components and a data layer. All component creation styles in Mithril output the same vnode structure using native Javascript features only. The direct consequence of leaning on the language is less tooling and a simpler project setup.
|
||||
|
||||
#### Documentation
|
||||
|
||||
|
|
|
|||
16
docs/keys.md
16
docs/keys.md
|
|
@ -96,21 +96,21 @@ users.map(function(u) {
|
|||
|
||||
#### 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
|
||||
// AVOID
|
||||
var Button = {
|
||||
var User = {
|
||||
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
|
||||
users.map(function(u) {
|
||||
return m("div", [
|
||||
m(Button, {key: u.id}, u.name) // key should be here, not in component
|
||||
])
|
||||
return m(User, { key: u.id, user: u }) // key should be here, not in component
|
||||
})
|
||||
```
|
||||
|
||||
|
|
@ -195,12 +195,12 @@ users[0].key = 'c'
|
|||
// AVOID
|
||||
users.map(function(user){
|
||||
// The component for John will be destroyed and recreated
|
||||
return m(UserComponent, user)
|
||||
return m(UserComponent, user)
|
||||
})
|
||||
|
||||
// PREFER
|
||||
users.map(function(user){
|
||||
// Key is specifically extracted: data model is given its own property
|
||||
return m(UserComponent, {key: user.id, model: user})
|
||||
return m(UserComponent, {key: user.id, model: user})
|
||||
})
|
||||
```
|
||||
|
|
|
|||
|
|
@ -477,7 +477,7 @@ module.exports = {
|
|||
oninput: m.withAttr("value", function(value) {User.current.lastName = value}),
|
||||
value: User.current.lastName
|
||||
}),
|
||||
m("button.button[type=button]", "Save"),
|
||||
m("button.button[type=submit]", "Save"),
|
||||
])
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue