mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
update component and qweb doc
This commit is contained in:
+28
-1
@@ -1,3 +1,30 @@
|
|||||||
# Component
|
# Component
|
||||||
|
|
||||||
hey
|
Components are the reusable, composable widgets. They are designed to be low
|
||||||
|
level, to be declarative, and with asynchronous rendering.
|
||||||
|
|
||||||
|
For example:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
export class Counter extends Component {
|
||||||
|
inlineTemplate = `
|
||||||
|
<div t-name="counter">
|
||||||
|
<button t-on-click="increment(-1)">-</button>
|
||||||
|
<span style="font-weight:bold">Value: <t t-esc="state.counter"/></span>
|
||||||
|
<button t-on-click="increment(1)">+</button>
|
||||||
|
</div>`;
|
||||||
|
|
||||||
|
state = {
|
||||||
|
counter: 0
|
||||||
|
};
|
||||||
|
|
||||||
|
constructor(parent, props) {
|
||||||
|
super(parent, props);
|
||||||
|
this.state.counter = props.initialState || 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
increment(delta) {
|
||||||
|
this.updateState({ counter: this.state.counter + delta });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|||||||
+25
-1
@@ -1,3 +1,27 @@
|
|||||||
# QWeb
|
# QWeb
|
||||||
|
|
||||||
hey
|
QWeb is a template specification. The QWeb class in this repository is:
|
||||||
|
|
||||||
|
- an implementation of the QWeb specification
|
||||||
|
- which outputs a virtual dom instead of a string
|
||||||
|
- and extended with a few extra directives
|
||||||
|
|
||||||
|
## QWeb Specification
|
||||||
|
|
||||||
|
add here a full description of what QWeb is supposed to be, with some examples
|
||||||
|
|
||||||
|
## QWeb Implementation
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
var qweb = new QWeb();
|
||||||
|
qweb.addTemplate("sometemplate", '<div>hello <t t-esc="name"/></div>');
|
||||||
|
|
||||||
|
// result is a vnode which represent <div>hello world</div>
|
||||||
|
result = qweb.render("sometemplate", { name: "world" });
|
||||||
|
```
|
||||||
|
|
||||||
|
## QWeb extensions
|
||||||
|
|
||||||
|
- t-on directive
|
||||||
|
- t-widget, t-props, t-key
|
||||||
|
- t-ref
|
||||||
|
|||||||
Reference in New Issue
Block a user