From 9a48e6f7daa39397719f6f7b566066f663b05b41 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=94=B3=E6=99=97?= Date: Thu, 23 Aug 2018 14:55:26 +0800 Subject: [PATCH 1/5] add createIntersectionObserver --- types/weixin-app/index.d.ts | 32 ++++++++++++++++++++++++++++++++ 1 file changed, 32 insertions(+) diff --git a/types/weixin-app/index.d.ts b/types/weixin-app/index.d.ts index c216cfa636..4e8516f075 100644 --- a/types/weixin-app/index.d.ts +++ b/types/weixin-app/index.d.ts @@ -3166,6 +3166,38 @@ declare namespace wx { touches: Touch[]; changedTouches: Touch[]; } + + /** + * WXML节点布局相交状态 + */ + interface createIntersectionObserverOption { + thresholds?: number[]; + initialRatio?: number; + selectAll?: boolean; + } + type margins = { + left?: number; + right?: number; + top?: number; + bottom?: number; + } + type callback = () => void; + type observeResponse = { + intersectionRatio: number; // 相交区域占目标节点的布局区域的比例 + intersectionRect: { + left: number; // 相交区域的左边界坐标 + top: number; // 相交区域的上边界坐标 + width: number; // 相交区域的宽度 + height: number; // 相交区域的高度 + } + } + interface createIntersectionObserverCallBack { + relativeTo: (selector?: string, margins?: margins) => createIntersectionObserverCallBack; + relativeToViewport: (margins?: margins) => createIntersectionObserverCallBack; + observe: (selector?: string, callback?: (response: observeResponse) => void) => createIntersectionObserverCallBack; + disconnect: () => void; + } + function createIntersectionObserver(options?: createIntersectionObserverOption): createIntersectionObserverCallBack // #endregion } // #region App里的onLaunch、onShow回调参数 From a56a02bdb699edbac061d77de1c0a27bf76d2b65 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=94=B3=E6=99=97?= Date: Thu, 23 Aug 2018 15:18:43 +0800 Subject: [PATCH 2/5] add test & complete definition --- types/weixin-app/index.d.ts | 28 +++++++++++++++++++++++----- types/weixin-app/weixin-app-tests.ts | 12 ++++++++++++ 2 files changed, 35 insertions(+), 5 deletions(-) diff --git a/types/weixin-app/index.d.ts b/types/weixin-app/index.d.ts index 4e8516f075..caff4bb6a6 100644 --- a/types/weixin-app/index.d.ts +++ b/types/weixin-app/index.d.ts @@ -3175,21 +3175,39 @@ declare namespace wx { initialRatio?: number; selectAll?: boolean; } - type margins = { + interface margins { left?: number; right?: number; top?: number; bottom?: number; } - type callback = () => void; - type observeResponse = { + interface observeResponse { + id: string; + dataset: any; + time: number; intersectionRatio: number; // 相交区域占目标节点的布局区域的比例 + boundingClientRect: { + bottom: number; + right: number; + left: number; + top: number; + width: number; + height: number; + }; intersectionRect: { + bottom: number; + right: number; left: number; // 相交区域的左边界坐标 top: number; // 相交区域的上边界坐标 width: number; // 相交区域的宽度 height: number; // 相交区域的高度 - } + }; + relativeRect: { + bottom: number; + right: number; + left: number; + top: number; + }; } interface createIntersectionObserverCallBack { relativeTo: (selector?: string, margins?: margins) => createIntersectionObserverCallBack; @@ -3197,7 +3215,7 @@ declare namespace wx { observe: (selector?: string, callback?: (response: observeResponse) => void) => createIntersectionObserverCallBack; disconnect: () => void; } - function createIntersectionObserver(options?: createIntersectionObserverOption): createIntersectionObserverCallBack + function createIntersectionObserver(options?: createIntersectionObserverOption): createIntersectionObserverCallBack; // #endregion } // #region App里的onLaunch、onShow回调参数 diff --git a/types/weixin-app/weixin-app-tests.ts b/types/weixin-app/weixin-app-tests.ts index f655509f44..09bbb5c653 100644 --- a/types/weixin-app/weixin-app-tests.ts +++ b/types/weixin-app/weixin-app-tests.ts @@ -119,6 +119,18 @@ Page({ onPageScroll: () => { // this. // Do something when page scroll + wx.createIntersectionObserver() + .relativeToViewport() + .observe("div", res => { + console.log(res.id); + console.log(res.dataset); + console.log(res.intersectionRatio); + console.log(res.intersectionRect.left); + console.log(res.intersectionRect.top); + console.log(res.intersectionRect.width); + console.log(res.intersectionRect.height); + }) + .disconnect(); }, onTabItemTap(item: any) { this.setData({ From bf84f8bcf8840292e1d673dd044c1b11e1328591 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=94=B3=E6=99=97?= Date: Thu, 23 Aug 2018 18:46:47 +0800 Subject: [PATCH 3/5] change ()=> type to (): type --- types/weixin-app/index.d.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/types/weixin-app/index.d.ts b/types/weixin-app/index.d.ts index caff4bb6a6..a426ac6a5e 100644 --- a/types/weixin-app/index.d.ts +++ b/types/weixin-app/index.d.ts @@ -3210,10 +3210,10 @@ declare namespace wx { }; } interface createIntersectionObserverCallBack { - relativeTo: (selector?: string, margins?: margins) => createIntersectionObserverCallBack; - relativeToViewport: (margins?: margins) => createIntersectionObserverCallBack; - observe: (selector?: string, callback?: (response: observeResponse) => void) => createIntersectionObserverCallBack; - disconnect: () => void; + relativeTo(selector?: string, margins?: margins): createIntersectionObserverCallBack; + relativeToViewport(margins?: margins): createIntersectionObserverCallBack; + observe(selector?: string, callback?: (response: observeResponse) => void): createIntersectionObserverCallBack; + disconnect(): void; } function createIntersectionObserver(options?: createIntersectionObserverOption): createIntersectionObserverCallBack; // #endregion From 4e9f4ae73183113a4567913f022a97edf86f04a4 Mon Sep 17 00:00:00 2001 From: DeepCold Date: Sat, 1 Sep 2018 20:55:45 +0800 Subject: [PATCH 4/5] format --- types/weixin-app/index.d.ts | 20 +++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) diff --git a/types/weixin-app/index.d.ts b/types/weixin-app/index.d.ts index b90ab8f4c6..8af88ba63d 100644 --- a/types/weixin-app/index.d.ts +++ b/types/weixin-app/index.d.ts @@ -2267,7 +2267,7 @@ declare namespace wx { * @version 1.4.0 */ function createSelectorQuery(): SelectorQuery; - + /** * WXML节点布局相交状态 */ @@ -2311,12 +2311,22 @@ declare namespace wx { }; } interface createIntersectionObserverCallBack { - relativeTo(selector?: string, margins?: margins): createIntersectionObserverCallBack; - relativeToViewport(margins?: margins): createIntersectionObserverCallBack; - observe(selector?: string, callback?: (response: observeResponse) => void): createIntersectionObserverCallBack; + relativeTo( + selector?: string, + margins?: margins + ): createIntersectionObserverCallBack; + relativeToViewport( + margins?: margins + ): createIntersectionObserverCallBack; + observe( + selector?: string, + callback?: (response: observeResponse) => void + ): createIntersectionObserverCallBack; disconnect(): void; } - function createIntersectionObserver(options?: createIntersectionObserverOption): createIntersectionObserverCallBack; + function createIntersectionObserver( + options?: createIntersectionObserverOption + ): createIntersectionObserverCallBack; interface NodesRefRect { /** 节点的ID */ From ea6e88eca273500d8f928fd9dd2736f06949b904 Mon Sep 17 00:00:00 2001 From: DeepCold Date: Sat, 1 Sep 2018 20:59:26 +0800 Subject: [PATCH 5/5] change to upper case --- types/weixin-app/index.d.ts | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/types/weixin-app/index.d.ts b/types/weixin-app/index.d.ts index 8af88ba63d..38af972ec2 100644 --- a/types/weixin-app/index.d.ts +++ b/types/weixin-app/index.d.ts @@ -2271,18 +2271,18 @@ declare namespace wx { /** * WXML节点布局相交状态 */ - interface createIntersectionObserverOption { + interface CreateIntersectionObserverOption { thresholds?: number[]; initialRatio?: number; selectAll?: boolean; } - interface margins { + interface Margins { left?: number; right?: number; top?: number; bottom?: number; } - interface observeResponse { + interface ObserveResponse { id: string; dataset: any; time: number; @@ -2310,23 +2310,23 @@ declare namespace wx { top: number; }; } - interface createIntersectionObserverCallBack { + interface CreateIntersectionObserverCallBack { relativeTo( selector?: string, - margins?: margins - ): createIntersectionObserverCallBack; + margins?: Margins + ): CreateIntersectionObserverCallBack; relativeToViewport( - margins?: margins - ): createIntersectionObserverCallBack; + margins?: Margins + ): CreateIntersectionObserverCallBack; observe( selector?: string, - callback?: (response: observeResponse) => void - ): createIntersectionObserverCallBack; + callback?: (response: ObserveResponse) => void + ): CreateIntersectionObserverCallBack; disconnect(): void; } function createIntersectionObserver( - options?: createIntersectionObserverOption - ): createIntersectionObserverCallBack; + options?: CreateIntersectionObserverOption + ): CreateIntersectionObserverCallBack; interface NodesRefRect { /** 节点的ID */