document component shorthand syntax
This commit is contained in:
parent
2b24c7a64d
commit
ed3f3f0686
4 changed files with 65 additions and 0 deletions
|
|
@ -6,6 +6,7 @@
|
|||
- [Optional controller](#optional-controller)
|
||||
- [Controller as a class constructor](#controller-as-a-class-constructor)
|
||||
- [Notes on the view function](#notes-on-the-view-function)
|
||||
- [Shorthand syntax](#shorthand-syntax)
|
||||
- [Parameterized components](#parameterized-components)
|
||||
- [Nesting components](#nesting-components)
|
||||
- [Dealing with state](#dealing-with-state)
|
||||
|
|
@ -148,6 +149,27 @@ The view function is run again whenever a redraw is required (i.e. whenever even
|
|||
|
||||
It may sound expensive to recompute an entire view any time there's a change to be displayed, but this operation actually turns out to be quite fast, compared to rendering strategies used by older frameworks. Mithril's diffing algorithm makes sure expensive DOM operations are performed only if absolutely necessary, and as an extra benefit, the global nature of the redraw makes it easy to reason about and troubleshoot the state of the application.
|
||||
|
||||
### Shorthand syntax
|
||||
|
||||
If the first argument to `m()` is a component, it acts as an alias of `m.component()`
|
||||
|
||||
```javascript
|
||||
var MyComponent = {
|
||||
controller: function() {
|
||||
return {greeting: "hello"}
|
||||
},
|
||||
view: function(ctrl, args) {
|
||||
return m("h1", ctrl.greeting + " " + args.data)
|
||||
}
|
||||
}
|
||||
|
||||
m.render(document.body, [
|
||||
//the two lines below are equivalent
|
||||
m(component, {data: "world"}),
|
||||
m.component(component, {data: "world"})
|
||||
])
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### Parameterized components
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue