@dolphinweex/weex-harmony 0.1.63 → 0.1.65

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dolphinweex/weex-harmony",
3
- "version": "0.1.63",
3
+ "version": "0.1.65",
4
4
  "description": "weex harmony adapter",
5
5
  "main": "index.js",
6
6
  "files": [
@@ -1,14 +1,24 @@
1
1
  <template>
2
2
  <div>
3
- <!-- <text v-if="progressText.length > 0">{{progressText}}</text> -->
4
- <iframe
5
- :id="embedId"
3
+ <div
4
+ style="position: relative"
6
5
  v-if="url.length > 0 && pluginType != 'old-h5'"
7
- :src="url"
8
- :style="{ backgroundColor: backgroundColor, height: height }"
9
- ref="iframe"
10
- @load="onPageFinish"
11
- ></iframe>
6
+ ref="iframeWrapper"
7
+ @touchstart="handleWrapperTouchStart"
8
+ @touchmove="handleWrapperTouchMove"
9
+ @touchend="handleWrapperTouchEnd"
10
+ >
11
+ <iframe
12
+ :id="embedId"
13
+ :src="url"
14
+ :style="{
15
+ backgroundColor: backgroundColor,
16
+ height: height,
17
+ }"
18
+ ref="iframe"
19
+ @load="onPageFinish"
20
+ ></iframe>
21
+ </div>
12
22
 
13
23
  <BaseSameLayer
14
24
  class="common-view-iframe"
@@ -37,7 +47,9 @@ export default {
37
47
  embedId: `embedId_iframe_${
38
48
  Date.now().toString(36) + Math.random().toString(36).substring(2)
39
49
  }`,
40
- height: "100%",
50
+ height: '100%',
51
+ _wrapperTouchParams: null, // wrapper触摸参数
52
+ _parentScroller: null, // 父级scroller元素引用
41
53
  };
42
54
  },
43
55
  components: {
@@ -123,7 +135,7 @@ export default {
123
135
  };
124
136
  this._wrapperEl = findWrapperFromParent(); // 保存容器引用
125
137
  this._onMessage = (event) => {
126
- if(event.data.type==='IFRAME_CONTENT_HEIGHT'){
138
+ if (event.data.type === 'IFRAME_CONTENT_HEIGHT') {
127
139
  const h = Number(event.data.height) || 0;
128
140
  if (!h) {
129
141
  return;
@@ -141,20 +153,106 @@ export default {
141
153
  },
142
154
  methods: {
143
155
  onPageFinish() {
144
- if (this.$refs["iframe"]) {
145
- this.$refs["iframe"].contentWindow.$midea_harmony_native =
156
+ if (this.$refs['iframe']) {
157
+ this.$refs['iframe'].contentWindow.$midea_harmony_native =
146
158
  window.$midea_harmony_native;
147
- this.$refs["iframe"].contentWindow.isIframe = true;
148
- this.$refs["iframe"].contentWindow.postMessage(
159
+ this.$refs['iframe'].contentWindow.isIframe = true;
160
+ this.$refs['iframe'].contentWindow.postMessage(
149
161
  JSON.stringify(window.$midea_harmony_native),
150
- "*"
162
+ '*'
151
163
  );
152
164
  }
153
165
  },
166
+
167
+ handleWrapperTouchStart(e) {
168
+ // iframe会接收到事件并处理自己的滚动
169
+ // 找到父级scroller(轮播图容器)或者气他?
170
+ this._findParentScroller();
171
+ // 如果找到了父级scroller,手动触发它的touchstart处理QxQ
172
+ if (this._parentScroller) {
173
+ this._forwardEventToParent(e, 'touchstart');
174
+ }
175
+ const touch = e.touches[0];
176
+ this._wrapperTouchParams = {
177
+ startX: touch.pageX,
178
+ startY: touch.pageY,
179
+ };
180
+ },
181
+
182
+ handleWrapperTouchMove(e) {
183
+ if (!this._wrapperTouchParams) return;
184
+ // iframe正在处理自己的滚动(不阻止)同时转发事件给父级scroller
185
+ if (this._parentScroller) {
186
+ this._forwardEventToParent(e, 'touchmove');
187
+ }
188
+ const touch = e.touches[0];
189
+ const offsetX = touch.pageX - this._wrapperTouchParams.startX;
190
+ const offsetY = touch.pageY - this._wrapperTouchParams.startY;
191
+ const absX = Math.abs(offsetX);
192
+ const absY = Math.abs(offsetY);
193
+
194
+ if (absX > absY && absX > 10) {
195
+ console.log('📱 横向滑动:iframe内滚动 + 父级轮播图同时响应');
196
+ } else if (absY > absX && absY > 10) {
197
+ console.log('📜 纵向滑动:iframe内容滚动');
198
+ }
199
+ },
200
+
201
+ handleWrapperTouchEnd(e) {
202
+ // 转发touchend事件给父级
203
+ if (this._parentScroller) {
204
+ this._forwardEventToParent(e, 'touchend');
205
+ }
206
+ this._wrapperTouchParams = null;
207
+ },
208
+
209
+ // 查找父级scroller元素
210
+ _findParentScroller() {
211
+ if (this._parentScroller) return;
212
+ let parent = this.$parent;
213
+ while (parent) {
214
+ const el = parent.$el;
215
+ if (
216
+ el &&
217
+ el.classList &&
218
+ (el.classList.contains('weex-scroller') ||
219
+ el.classList.contains('weex-slider') ||
220
+ el.classList.contains('weex-list'))
221
+ ) {
222
+ this._parentScroller = el;
223
+ console.log('✅ 找到父级scroller,将转发事件');
224
+ return;
225
+ }
226
+ parent = parent.$parent;
227
+ }
228
+ console.warn('⚠️ 未找到父级scroller');
229
+ },
230
+
231
+ // 手动转发事件到父级scroller
232
+ _forwardEventToParent(originalEvent, eventType) {
233
+ if (!this._parentScroller) return;
234
+ try {
235
+ const newEvent = new TouchEvent(eventType, {
236
+ bubbles: true,
237
+ cancelable: true,
238
+ touches: originalEvent.touches,
239
+ targetTouches: originalEvent.targetTouches,
240
+ changedTouches: originalEvent.changedTouches,
241
+ view: window,
242
+ });
243
+
244
+ // 直接触发到父级scroller元素
245
+ this._parentScroller.dispatchEvent(newEvent);
246
+ } catch (err) {
247
+ console.warn('无法转发触摸事件', err);
248
+ }
249
+ },
154
250
  },
155
251
  };
156
252
  </script>
157
253
 
158
254
  <style scoped>
159
-
255
+ .common-view-iframe {
256
+ height: 100%;
257
+ }
160
258
  </style>