blackteay/vant-weapp
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant-weapp.git synced 2025-04-06 03:58:05 +08:00
Code Issues Projects Releases Wiki Activity

refactor(rect): remove getRect behavior (#3795)

Browse Source
This commit is contained in:
rex 2020-11-30 16:17:48 +08:00 committed by GitHub
parent 0343307825
commit 9725ec336b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 66 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
packages/collapse-item/index.ts
View File

@ -1,3 +1,4 @@
import { getRect } from '../common/utils';
import { VantComponent } from '../common/component'; import { VantComponent } from '../common/component';
VantComponent({ VantComponent({
@ -70,11 +71,9 @@ VantComponent({
updateStyle(expanded: boolean) { updateStyle(expanded: boolean) {
const { inited } = this; const { inited } = this;
this.getRect('.van-collapse-item__content') getRect
.then( .call(this, '.van-collapse-item__content')
(rect: WechatMiniprogram.BoundingClientRectCallbackResult) => .then((rect) => rect.height)
rect.height
)
.then((height: number) => { .then((height: number) => {
const { animation } = this; const { animation } = this;

27
packages/dropdown-menu/index.ts
View File

@ -1,5 +1,5 @@
import { VantComponent } from '../common/component'; import { VantComponent } from '../common/component';
import { addUnit } from '../common/utils'; import { addUnit, getRect } from '../common/utils';
type TrivialInstance = WechatMiniprogram.Component.TrivialInstance; type TrivialInstance = WechatMiniprogram.Component.TrivialInstance;
let ARRAY: TrivialInstance[] = []; let ARRAY: TrivialInstance[] = [];
@ -101,23 +101,20 @@ VantComponent({
getChildWrapperStyle() { getChildWrapperStyle() {
const { zIndex, direction } = this.data; const { zIndex, direction } = this.data;
return this.getRect('.van-dropdown-menu').then( return getRect.call(this, '.van-dropdown-menu').then((rect) => {
(rect: WechatMiniprogram.BoundingClientRectCallbackResult) => { const { top = 0, bottom = 0 } = rect;
const { top = 0, bottom = 0 } = rect; const offset = direction === 'down' ? bottom : this.windowHeight - top;
const offset =
direction === 'down' ? bottom : this.windowHeight - top;
let wrapperStyle = `z-index: ${zIndex};`; let wrapperStyle = `z-index: ${zIndex};`;
if (direction === 'down') { if (direction === 'down') {
wrapperStyle += `top: ${addUnit(offset)};`; wrapperStyle += `top: ${addUnit(offset)};`;
} else { } else {
wrapperStyle += `bottom: ${addUnit(offset)};`; wrapperStyle += `bottom: ${addUnit(offset)};`;
}
return wrapperStyle;
} }
);
return wrapperStyle;
});
}, },
onTitleTap(event: WechatMiniprogram.TouchEvent) { onTitleTap(event: WechatMiniprogram.TouchEvent) {

19
packages/index-anchor/index.ts
View File

@ -1,3 +1,4 @@
import { getRect } from '../common/utils';
import { VantComponent } from '../common/component'; import { VantComponent } from '../common/component';
VantComponent({ VantComponent({
@ -20,18 +21,12 @@ VantComponent({
methods: { methods: {
scrollIntoView(scrollTop) { scrollIntoView(scrollTop) {
this.getBoundingClientRect().then( getRect.call(this, '.van-index-anchor-wrapper').then((rect) => {
(rect: WechatMiniprogram.BoundingClientRectCallbackResult) => { wx.pageScrollTo({
wx.pageScrollTo({ duration: 0,
duration: 0, scrollTop: scrollTop + rect.top - this.parent.data.stickyOffsetTop,
scrollTop: scrollTop + rect.top - this.parent.data.stickyOffsetTop, });
}); });
}
);
},
getBoundingClientRect() {
return this.getRect('.van-index-anchor-wrapper');
}, },
}, },
}); });

18
packages/mixins/basic.ts
View File

@ -13,23 +13,5 @@ export const basic = Behavior({
return new Promise((resolve) => wx.nextTick(resolve)); return new Promise((resolve) => wx.nextTick(resolve));
}, },
getRect(selector: string, all: boolean) {
return new Promise((resolve) => {
wx.createSelectorQuery()
.in(this)
[all ? 'selectAll' : 'select'](selector)
.boundingClientRect((rect) => {
if (all && Array.isArray(rect) && rect.length) {
resolve(rect);
}
if (!all && rect) {
resolve(rect);
}
})
.exec();
});
},
}, },
}); });

23
packages/rate/index.ts
View File

@ -1,3 +1,4 @@
import { getAllRect } from '../common/utils';
import { VantComponent } from '../common/component'; import { VantComponent } from '../common/component';
import { canIUseModel } from '../common/version'; import { canIUseModel } from '../common/version';
@ -82,19 +83,17 @@ VantComponent({
const { clientX } = event.touches[0]; const { clientX } = event.touches[0];
this.getRect('.van-rate__icon', true).then( getAllRect.call(this, '.van-rate__icon').then((list) => {
(list: WechatMiniprogram.BoundingClientRectCallbackResult[]) => { const target = list
const target = list .sort((item) => item.right - item.left)
.sort((item) => item.right - item.left) .find((item) => clientX >= item.left && clientX <= item.right);
.find((item) => clientX >= item.left && clientX <= item.right); if (target != null) {
if (target != null) { this.onSelect({
this.onSelect({ ...event,
...event, currentTarget: target,
currentTarget: target, });
});
}
} }
); });
}, },
}, },
}); });

25
packages/slider/index.ts
View File

@ -1,6 +1,7 @@
import { VantComponent } from '../common/component'; import { VantComponent } from '../common/component';
import { touch } from '../mixins/touch'; import { touch } from '../mixins/touch';
import { canIUseModel } from '../common/version'; import { canIUseModel } from '../common/version';
import { getRect } from '../common/utils';
VantComponent({ VantComponent({
mixins: [touch], mixins: [touch],
@ -60,13 +61,11 @@ VantComponent({
this.touchMove(event); this.touchMove(event);
this.dragStatus = 'draging'; this.dragStatus = 'draging';
this.getRect('.van-slider').then( getRect.call(this, '.van-slider').then((rect) => {
(rect: WechatMiniprogram.BoundingClientRectCallbackResult) => { const diff = (this.deltaX / rect.width) * 100;
const diff = (this.deltaX / rect.width) * 100; this.newValue = this.startValue + diff;
this.newValue = this.startValue + diff; this.updateValue(this.newValue, false, true);
this.updateValue(this.newValue, false, true); });
}
);
}, },
onTouchEnd() { onTouchEnd() {
@ -83,13 +82,11 @@ VantComponent({
const { min } = this.data; const { min } = this.data;
this.getRect('.van-slider').then( getRect.call(this, '.van-slider').then((rect) => {
(rect: WechatMiniprogram.BoundingClientRectCallbackResult) => { const value =
const value = ((event.detail.x - rect.left) / rect.width) * this.getRange() + min;
((event.detail.x - rect.left) / rect.width) * this.getRange() + min; this.updateValue(value, true);
this.updateValue(value, true); });
}
);
}, },
updateValue(value: number, end: boolean, drag: boolean) { updateValue(value: number, end: boolean, drag: boolean) {

40
packages/sticky/index.ts
View File

@ -1,10 +1,9 @@
import { getRect } from '../common/utils';
import { VantComponent } from '../common/component'; import { VantComponent } from '../common/component';
import { pageScrollMixin } from '../mixins/page-scroll'; import { pageScrollMixin } from '../mixins/page-scroll';
const ROOT_ELEMENT = '.van-sticky'; const ROOT_ELEMENT = '.van-sticky';
type BoundingClientRect = WechatMiniprogram.BoundingClientRectCallbackResult;
VantComponent({ VantComponent({
props: { props: {
zIndex: { zIndex: {
@ -66,29 +65,30 @@ VantComponent({
this.scrollTop = scrollTop || this.scrollTop; this.scrollTop = scrollTop || this.scrollTop;
if (typeof container === 'function') { if (typeof container === 'function') {
Promise.all([this.getRect(ROOT_ELEMENT), this.getContainerRect()]).then( Promise.all([
([root, container]: BoundingClientRect[]) => { getRect.call(this, ROOT_ELEMENT),
if (offsetTop + root.height > container.height + container.top) { this.getContainerRect(),
this.setDataAfterDiff({ ]).then(([root, container]) => {
fixed: false, if (offsetTop + root.height > container.height + container.top) {
transform: container.height - root.height, this.setDataAfterDiff({
}); fixed: false,
} else if (offsetTop >= root.top) { transform: container.height - root.height,
this.setDataAfterDiff({ });
fixed: true, } else if (offsetTop >= root.top) {
height: root.height, this.setDataAfterDiff({
transform: 0, fixed: true,
}); height: root.height,
} else { transform: 0,
this.setDataAfterDiff({ fixed: false, transform: 0 }); });
} } else {
this.setDataAfterDiff({ fixed: false, transform: 0 });
} }
); });
return; return;
} }
this.getRect(ROOT_ELEMENT).then((root: BoundingClientRect) => { getRect.call(this, ROOT_ELEMENT).then((root) => {
if (offsetTop >= root.top) { if (offsetTop >= root.top) {
this.setDataAfterDiff({ fixed: true, height: root.height }); this.setDataAfterDiff({ fixed: true, height: root.height });
this.transform = 0; this.transform = 0;

2
packages/tree-select/index.ts
View File

@ -70,7 +70,7 @@ VantComponent({
const { items, mainActiveIndex } = this.data; const { items, mainActiveIndex } = this.data;
const { children = [] } = items[mainActiveIndex] || {}; const { children = [] } = items[mainActiveIndex] || {};
return this.set({ subItems: children }); this.setData({ subItems: children });
}, },
}, },
}); });