docs: update readme

README.CN.md

@@ -5,6 +5,36 @@
 <h2 align="center">Omi - 前端跨框架跨平台框架</h2>
 <p align="center"><b>基于 Web Components 并支持 IE8+(omio)，小程序(omip) 和 任意前端框架集成</b></p>
 
+## 快速概览
+
+整个组件树共享数据，并且数据变更自动更新视图。
+
+```jsx
+import { define, render } from 'omi'
+
+class Store {
+  data = {
+    count: 1
+  }
+  sub = () => {
+    this.data.count--
+  }
+  add = () => {
+    this.data.count++
+  }
+}
+
+define('my-counter', ['count'], _ => (
+  <div>
+    <button onClick={_.store.sub}>-</button>
+    <span>{_.store.data.count}</span>
+    <button onClick={_.store.add}>+</button>
+  </div>
+))
+
+render(<my-counter />, 'body', new Store)
+```
+
 ## Omi 生态
 
 [→ Omi 生态学习路线图](https://github.com/Tencent/omi/tree/master/assets/rm.md)

README.md

@@ -5,6 +5,36 @@ English | [简体中文](./README.CN.md)
 <h2 align="center">Omi -  Front End Cross-Frameworks Framework</h2>
 <p align="center">Merge Web Components, JSX, HTM, Virtual DOM, Functional style and Proxy into one framework with tiny size and high performance. Write components once, using in everywhere, such as Omi, React, Preact, Vue or Angular.</p>
 
+## Quick Preview
+
+Pass data through the component tree without having to pass props down manually at every level by store, auto update the view on demand.
+
+```jsx
+import { define, render } from 'omi'
+
+class Store {
+  data = {
+    count: 1
+  }
+  sub = () => {
+    this.data.count--
+  }
+  add = () => {
+    this.data.count++
+  }
+}
+
+define('my-counter', ['count'], _ => (
+  <div>
+    <button onClick={_.store.sub}>-</button>
+    <span>{_.store.data.count}</span>
+    <button onClick={_.store.add}>+</button>
+  </div>
+))
+
+render(<my-counter />, 'body', new Store)
+```
+
 ## Ecosystem of Omi
 
 [→ Omi Developer Roadmap](https://github.com/Tencent/omi/tree/master/assets/rm.md)

packages/omi/README.md

@@ -5,6 +5,37 @@ English | [简体中文](https://github.com/Tencent/omi/blob/master/README.CN.md
 <h2 align="center">Omi -  Front End Cross-Frameworks Framework</h2>
 <p align="center">Merge Web Components, JSX, HTM, Virtual DOM, Functional style and Proxy into one framework with tiny size and high performance. Write components once, using in everywhere, such as Omi, React, Preact, Vue or Angular.</p>
 
+
+## Quick Preview
+
+Pass data through the component tree without having to pass props down manually at every level by store, auto update the view on demand.
+
+```jsx
+import { define, render } from 'omi'
+
+class Store {
+  data = {
+    count: 1
+  }
+  sub = () => {
+    this.data.count--
+  }
+  add = () => {
+    this.data.count++
+  }
+}
+
+define('my-counter', ['count'], _ => (
+  <div>
+    <button onClick={_.store.sub}>-</button>
+    <span>{_.store.data.count}</span>
+    <button onClick={_.store.add}>+</button>
+  </div>
+))
+
+render(<my-counter />, 'body', new Store)
+```
+
 ## Ecosystem of Omi
 
 #### Base