NextERP/owl
2
0
Fork 0
mirror of https://github.com/odoo/owl.git synced 2025-10-06 19:59:41 +07:00
Code Issues Packages Projects Releases Wiki Activity

[DOC] improve main readme.md

Browse Source
This commit is contained in:
Géry Debongnie
2019-10-26 09:26:39 +02:00
parent 97b914b9cd
commit b5b6b7342e
1 changed files with 6 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+6 -10
View File
@@ -28,20 +28,16 @@ Owl is currently mostly stable. Possible future changes are explained in the
Here is a short example to illustrate interactive components: Here is a short example to illustrate interactive components:
```javascript ```javascript
import { Component, QWeb, useState } from "owl"; const { Component, QWeb, useState } = owl;
import { xml } from "owl/tags"; const { xml } = owl.tags;
class Counter extends Component { class Counter extends Component {
static template = xml` static template = xml`
<button t-on-click="increment"> <button t-on-click="state.value++">
Click Me! [<t t-esc="state.value"/>] Click Me! [<t t-esc="state.value"/>]
</button>`; </button>`;
state = useState({ value: 0 }); state = useState({ value: 0 });
increment() {
this.state.value++;
}
} }
class App extends Component { class App extends Component {
@@ -58,8 +54,8 @@ const app = new App({ qweb: new QWeb() });
app.mount(document.body); app.mount(document.body);
``` ```
Note that the counter component is made reactive with the [`useState`](doc/hooks.md#usestate) Note that the counter component is made reactive with the [`useState` hook](doc/hooks.md#usestate).
hook. Also, all examples here uses the `xml` helper to define inline templates. Also, all examples here uses the [`xml` helper](doc/tags.md#xml-tag) to define inline templates.
But this is not mandatory, many applications will load templates separately. But this is not mandatory, many applications will load templates separately.
More interesting examples can be found on the More interesting examples can be found on the
@@ -132,7 +128,7 @@ Owl components in an application are used to define a (dynamic) tree of componen
``` ```
**Environment:** the root component is special: it is created with an environment, **Environment:** the root component is special: it is created with an environment,
which should contain a `QWeb` instance. The environment is then automatically which should contain a [`QWeb` instance](doc/qweb.md). The environment is then automatically
propagated to each sub components (and accessible in the `this.env` property). propagated to each sub components (and accessible in the `this.env` property).
```js ```js