From 0097246bed3785bbee6a7ed50263de75458bcdf3 Mon Sep 17 00:00:00 2001
From: yy-wow <yaoyun_bigger@outlook.com>
Date: Mon, 11 Nov 2024 10:56:08 -0800
Subject: [PATCH] fix: README

---
 packages/renderer/README.md       | 41 ++++++++++++++++++++++---------
 packages/renderer/README.zh-CN.md | 41 ++++++++++++++++++++++---------
 2 files changed, 58 insertions(+), 24 deletions(-)

diff --git a/packages/renderer/README.md b/packages/renderer/README.md
index 026c71359..9a22e301c 100644
--- a/packages/renderer/README.md
+++ b/packages/renderer/README.md
@@ -8,21 +8,38 @@ A Vue3 renderer for tiny-engine.
 
 ```javascript
 // xxx.vue
-import { h, reactive } from 'vue'
-import Main from '@opentiny/tiny-engine-renderer'
+import { h } from 'vue'
+import Main, { api } from '@opentiny/tiny-engine-renderer'
+
+const getSchema = () => {
+  return newPromise((resolve) => {
+    setTimeout(() => {
+      const data = {
+        state: {},
+        children: [
+          {
+            componentName: 'Text',
+            props: {
+              text: 'Title'
+            }
+          }
+        ]
+      }
+      resolve(data)
+    }, 100)
+  })
+}
 
 export default {
-  render() {
-    // utils
-    const utils = reactive({})
-    // globalState
-    const globalState = reactive([])
-    // dataSource
-    const dataSourceMap = reactive({})
-    // schema
-    const schema = reactive({})
+  setup() {
+    onMounted(async () => {
+      const schema = await getSchema()
 
-    return schema.children.length ? h(Main, { schema, utils, globalState, dataSourceList }) : null
+      api.setSchema(schema)
+    })
+  },
+  render() {
+    return h(Main)
   }
 }
 ```
diff --git a/packages/renderer/README.zh-CN.md b/packages/renderer/README.zh-CN.md
index 31d0036b6..360ae0378 100644
--- a/packages/renderer/README.zh-CN.md
+++ b/packages/renderer/README.zh-CN.md
@@ -8,21 +8,38 @@
 
 ```javascript
 // xxx.vue
-import { h, reactive } from 'vue'
-import Main from '@opentiny/tiny-engine-renderer'
+import { h } from 'vue'
+import Main, { api } from '@opentiny/tiny-engine-renderer'
+
+const getSchema = () => {
+  return newPromise((resolve) => {
+    setTimeout(() => {
+      const data = {
+        state: {},
+        children: [
+          {
+            componentName: 'Text',
+            props: {
+              text: '标题'
+            }
+          }
+        ]
+      }
+      resolve(data)
+    }, 100)
+  })
+}
 
 export default {
-  render() {
-    // 页面schema
-    const schema = reactive({})
-    // 工具类
-    const utils = reactive({})
-    // 全局状态
-    const globalState = reactive([])
-    // 数据源
-    const dataSourceMap = reactive({})
+  setup() {
+    onMounted(async () => {
+      const schema = await getSchema()
 
-    return schema.children.length ? h(Main, { schema, utils, globalState, dataSourceList }) : null
+      api.setSchema(schema)
+    })
+  },
+  render() {
+    return h(Main)
   }
 }
 ```