Skip to content

Commit

Permalink
Remove a section that's 1. buggy and 2. controversial [skip ci]
Browse files Browse the repository at this point in the history
See discussion in #2250 and #1986 for more details.
  • Loading branch information
dead-claudia committed Oct 28, 2018
1 parent 3e49458 commit 401ed6b
Showing 1 changed file with 0 additions and 30 deletions.
30 changes: 0 additions & 30 deletions docs/components.md
Original file line number Diff line number Diff line change
Expand Up @@ -363,36 +363,6 @@ This way, the `Auth` module is now the source of truth for auth-related state, a

As a bonus, notice that we no longer need to use `.bind` to keep a reference to the state for the component's event handlers.

#### Avoid restrictive interfaces

Try to keep component interfaces generic - using `attrs` and `children` directly - unless the component requires special logic to operate on input.

In the example below, the `button` configuration is severely limited: it does not support any events other than `onclick`, it's not styleable and it only accepts text as children (but not elements, fragments or trusted HTML).

```javascript
// AVOID
var RestrictiveComponent = {
view: function(vnode) {
return m("button", {onclick: vnode.attrs.onclick}, [
"Click to " + vnode.attrs.text
])
}
}
```

If the required attributes are equivalent to generic DOM attributes, it's preferable to allow passing through parameters to a component's root node.

```javascript
// PREFER
var FlexibleComponent = {
view: function(vnode) {
return m("button", vnode.attrs, [
"Click to ", vnode.children
])
}
}
```

#### Don't manipulate `children`

If a component is opinionated in how it applies attributes or children, you should switch to using custom attributes.
Expand Down

0 comments on commit 401ed6b

Please sign in to comment.