@aks-dev/easyui 1.0.103 → 1.0.104

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/lib/Echarts/EchartsView.tsx +94 -55
  2. package/package.json +1 -1
package/lib/Echarts/EchartsView.tsx CHANGED
@@ -2,7 +2,7 @@
2
2
  * @Author: shiguo
3
3
  * @Date: 2022-05-05 14:52:53
4
4
  * @LastEditors: shiguo
5
- * @LastEditTime: 2022-09-14 11:01:38
5
+ * @LastEditTime: 2022-09-14 11:28:39
6
6
  * @FilePath: /@aks-dev/easyui/lib/Echarts/EchartsView.tsx
7
7
  */
8
8
  import * as React from 'react'
@@ -48,73 +48,112 @@ const EchartsView: React.FC<EchartsViewProps> = (props) => {
48
48
  }, [props.style])
49
49
 
50
50
 
51
-
52
-
53
-
54
-
55
- React.useEffect(() => {
56
- // console.log('useEffect', state.isLoaded,props.option)
57
-
51
+ React.useLayoutEffect(() => {
58
52
  if (state.isLoaded) {
53
+ let height = state.height ? `${state.height}px` : 'auto'
54
+ let width = state.width ? `${state.width}px` : 'auto'
59
55
  const run = `
60
- ;(function() {
61
- var instance = echarts.init(document.getElementById('main'));
62
- instance.clear();
63
- setTimeout(() => {
64
- instance.setOption(${toString(props.option)});
65
- }, 50);
66
-
67
- })();
68
- `
56
+ ;(function() {
57
+ var instance = echarts.getInstanceByDom(document.getElementById('main'));
58
+ if(instance == null){
59
+ document.getElementById('main').style.height = "${height}";
60
+ document.getElementById('main').style.width = "${width}";
61
+ instance = echarts.init(document.getElementById('main'));
62
+ }
63
+ instance.clear();
64
+ instance.setOption(${toString(props.option)});
65
+ })();
66
+ `
69
67
  WebViewRef.current?.injectJavaScript(run);
70
68
 
71
69
  return () => {
70
+ console.log('useEffect relase')
72
71
  const run = `
73
- ;(function() {
74
- var instance = echarts.getInstanceByDom(document.getElementById('main'));
75
- instance.clear();
76
- if(!instance.isDisposed()){
77
- instance.clear();
78
- }
79
- })();
80
- `
72
+ ;(function() {
73
+ var instance = echarts.getInstanceByDom(document.getElementById('main'));
74
+ instance.clear();
75
+ if(!instance.isDisposed()){
76
+ instance.dispose();
77
+ }
78
+ })();
79
+ `
81
80
  WebViewRef.current?.injectJavaScript(run);
82
81
  }
83
82
  }
84
83
 
85
- return undefined
86
84
 
85
+ return undefined
87
86
  }, [props.option, state.isLoaded])
88
87
 
89
88
 
90
-
91
-
92
- const injectedJavaScript = (): string => {
93
- // console.log('injectedJavaScript',props.option)
94
- let height = state.height ? `${state.height}px` : 'auto'
95
- let width = state.width ? `${state.width}px` : 'auto'
96
- return `
97
- ;(function() {
98
- document.getElementById('main').style.height = "${height}";
99
- document.getElementById('main').style.width = "${width}";
100
- var instance = echarts.init(document.getElementById('main'));
101
- instance.setOption(${toString(props.option)});
102
- instance.on('click', function(params) {
103
- var seen = [];
104
- var paramsString = JSON.stringify(params, function(key, val) {
105
- if (val != null && typeof val == "object") {
106
- if (seen.indexOf(val) >= 0) {
107
- return;
108
- }
109
- seen.push(val);
110
- }
111
- return val;
112
- });
113
- // window.ReactNativeWebView.postMessage(JSON.stringify({"types":"ON_PRESS","payload": paramsString}));
114
- });
115
- })();
116
- `
117
- }
89
+ // React.useEffect(() => {
90
+ // console.log('useEffect', state.isLoaded)
91
+
92
+ // if (state.isLoaded) {
93
+ // const run = `
94
+ // ;(function() {
95
+ // var instance = echarts.getInstanceByDom(document.getElementById('main'));
96
+ // if(instance == null){
97
+ // instance = echarts.init(document.getElementById('main'));
98
+ // }
99
+ // instance.clear();
100
+ // instance.setOption(${toString(props.option)});
101
+ // })();
102
+ // `
103
+ // WebViewRef.current?.injectJavaScript(run);
104
+
105
+ // return () => {
106
+ // console.log('useEffect relase')
107
+ // const run = `
108
+ // ;(function() {
109
+ // var instance = echarts.getInstanceByDom(document.getElementById('main'));
110
+ // instance.clear();
111
+ // if(!instance.isDisposed()){
112
+ // instance.dispose();
113
+ // }
114
+ // })();
115
+ // `
116
+ // WebViewRef.current?.injectJavaScript(run);
117
+ // }
118
+ // }
119
+
120
+ // return undefined
121
+
122
+ // }, [props.option, state.isLoaded])
123
+
124
+
125
+
126
+
127
+ // const injectedJavaScript = (): string => {
128
+ // console.log('injectedJavaScript', props.option.xAxis.data)
129
+ // let height = state.height ? `${state.height}px` : 'auto'
130
+ // let width = state.width ? `${state.width}px` : 'auto'
131
+ // return `
132
+ // ;(function() {
133
+ // document.getElementById('main').style.height = "${height}";
134
+ // document.getElementById('main').style.width = "${width}";
135
+ // var instance = echarts.getInstanceByDom(document.getElementById('main'));
136
+ // if(instance == null){
137
+ // instance = echarts.init(document.getElementById('main'));
138
+ // }
139
+ // instance.clear();
140
+ // instance.setOption(${toString(props.option)});
141
+ // instance.on('click', function(params) {
142
+ // var seen = [];
143
+ // var paramsString = JSON.stringify(params, function(key, val) {
144
+ // if (val != null && typeof val == "object") {
145
+ // if (seen.indexOf(val) >= 0) {
146
+ // return;
147
+ // }
148
+ // seen.push(val);
149
+ // }
150
+ // return val;
151
+ // });
152
+ // // window.ReactNativeWebView.postMessage(JSON.stringify({"types":"ON_PRESS","payload": paramsString}));
153
+ // });
154
+ // })();
155
+ // `
156
+ // }
118
157
 
119
158
 
120
159
 
@@ -137,7 +176,7 @@ const EchartsView: React.FC<EchartsViewProps> = (props) => {
137
176
  // console.log(e)
138
177
  // }}
139
178
  javaScriptEnabled={true}
140
- injectedJavaScript={injectedJavaScript()}
179
+ // injectedJavaScript={injectedJavaScript()}
141
180
  startInLoadingState={false}
142
181
  onLoadEnd={(_) => {
143
182
  dispatch({ isLoaded: true })
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@aks-dev/easyui",
3
- "version": "1.0.103",
3
+ "version": "1.0.104",
4
4
  "description": "移动端App开发工具包",
5
5
  "main": "./src/index.ts",
6
6
  "typings": "./src/index.d.ts",