feat:增加小程序onError

antvis · Oct 25, 2023 · bb72701 · bb72701
1 parent 50235fa
commit bb72701
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 33 deletions.
diff --git a/packages/my/examples/test/mini.project.json b/packages/my/examples/test/mini.project.json
@@ -1,7 +1,10 @@
 {
+  "format": 2,
+  "compileOptions": {
+    "component2": true,
+    "enableNodeModuleBabelTransform": true
+  },
   "scripts": {
     "beforeCompile": "npm run beforeCompile"
-  },
-  "enableNodeModuleBabelTransform": true,
-  "component2": true
-}
+  }
+}
diff --git a/packages/my/examples/test/pages/index/index.axml b/packages/my/examples/test/pages/index/index.axml
@@ -1,3 +1,3 @@
 <view class="container">
-  <f2 onRender="onRenderChart" data="{{chartData}}"></f2>
+  <f2 onRender="onRenderChart" data="{{chartData}}" onError="onError"></f2>
 </view>
diff --git a/packages/my/examples/test/pages/index/index.js b/packages/my/examples/test/pages/index/index.js
@@ -35,31 +35,34 @@ const data2 = [{
   sold: 50
 }];
 Page({
-  data: {// chartData: data1,
+  data: {
+    // chartData: data1,
   },
-
   onReady() {
     this.setData({
       chartData: data1
-    }); // 模拟数据更新
-
+    });
+    // 模拟数据更新
     setTimeout(() => {
       this.setData({
         chartData: data2
       });
     }, 2000);
   },
-
+  onError(e) {
+    console.log(e);
+  },
   onRenderChart(props) {
     const {
       data
     } = props;
     return _jsx(Chart, {
       data: data
-    }); // 如果不使用 jsx, 用下面代码效果也是一样的
+    });
+
+    // 如果不使用 jsx, 用下面代码效果也是一样的
     // return createElement(Chart, {
     //   data: data,
     // });
   }
-
 });
diff --git a/packages/my/examples/test/pages/index/index.jsx b/packages/my/examples/test/pages/index/index.jsx
@@ -33,6 +33,9 @@ Page({
       });
     }, 2000);
   },
+  onError(e){
+console.log(e)
+  },
   onRenderChart(props) {
     const { data } = props;
     return <Chart data={data} />;

diff --git a/packages/my/src/index.tsx b/packages/my/src/index.tsx
@@ -35,27 +35,32 @@ Component({
       return;
     }
     const { id } = this.data;
-    const query = my.createSelectorQuery({ page: this.$page });
-    query
-      .select(`#${id}`)
-      .boundingClientRect()
-      .exec((res) => {
-        // 获取画布实际宽高, 用props的宽高做失败兜底
-        const { width, height } = res && res[0] ? res[0] : this.props;
-        const pixelRatio = getPixelRatio();
-        // 高清解决方案
-        this.setData(
-          {
-            width: width * pixelRatio,
-            height: height * pixelRatio,
-          },
-          () => {
-            const myCtx = my.createCanvasContext(id);
-            const context = F2Context(myCtx);
-            this.canvasRender({ width, height, context, pixelRatio });
-          }
-        );
-      });
+    const { onError } = this.props;
+    try {
+      const query = my.createSelectorQuery({ page: this.$page });
+      query
+        .select(`#${id}`)
+        .boundingClientRect()
+        .exec((res) => {
+          // 获取画布实际宽高, 用props的宽高做失败兜底
+          const { width, height } = res && res[0] ? res[0] : this.props;
+          const pixelRatio = getPixelRatio();
+          // 高清解决方案
+          this.setData(
+            {
+              width: width * pixelRatio,
+              height: height * pixelRatio,
+            },
+            () => {
+              const myCtx = my.createCanvasContext(id);
+              const context = F2Context(myCtx);
+              this.canvasRender({ width, height, context, pixelRatio });
+            }
+          );
+        });
+    } catch (error) {
+      onError && onError(error);
+    }
   },
   didUpdate() {
     const { canvas, props } = this;