diff --git a/template.md b/template.md index def1473..0c7a477 100644 --- a/template.md +++ b/template.md @@ -239,7 +239,7 @@ class Foo extends Component { 对组件内的节点配置动画 ```js -class Foo extends { +class Foo extends Component { render() { // 配置同上 @@ -261,15 +261,50 @@ class Foo extends { ### 双向绑定 - - - - - - - - - +> 上面提到过, 由于模板机制的原因。框架无法实现内置双向绑定。只能是开发者手动实现。实现的方式, 也比较简单, 就是手动监听一下相应的事件来自动更新属性值即可。 + + +```js +class Foo extends Component { + + static props = { + value: '' + } + + render() { + return html` (this.value = ev.target.value)} >` + } + +} + +``` + + + + +### 属性绑定之样式设置 +> `style`和`class`这2种设置样式的属性, 比较特殊, 往往会有多个值, 以及多种条件, 所以框架内置了2个方法`classMap`和`styleMap`, 用于简化绑定设置。 + + +```js + +let classes = classMap({ + foo: true, + bar: this.bar, + ['goo-' + this.id]: true +}) +let styles = styleMap({ + width: '888px', + height: '200px', + backgroundColor: '#f30' + }) + +html` +