perf: update affix
parent
e2c86fe21e
commit
733c8fce8e
|
@ -131,7 +131,12 @@ const Affix = {
|
||||||
measure() {
|
measure() {
|
||||||
const { status, lastAffix } = this;
|
const { status, lastAffix } = this;
|
||||||
const { target } = this;
|
const { target } = this;
|
||||||
if (status !== AffixStatus.Prepare || !this.$refs.fixedNode || !this.$el || !target) {
|
if (
|
||||||
|
status !== AffixStatus.Prepare ||
|
||||||
|
!this.$refs.fixedNode ||
|
||||||
|
!this.$refs.placeholderNode ||
|
||||||
|
!target
|
||||||
|
) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -147,7 +152,7 @@ const Affix = {
|
||||||
status: AffixStatus.None,
|
status: AffixStatus.None,
|
||||||
};
|
};
|
||||||
const targetRect = getTargetRect(targetNode);
|
const targetRect = getTargetRect(targetNode);
|
||||||
const placeholderReact = getTargetRect(this.$el);
|
const placeholderReact = getTargetRect(this.$refs.placeholderNode);
|
||||||
const fixedTop = getFixedTop(placeholderReact, targetRect, offsetTop);
|
const fixedTop = getFixedTop(placeholderReact, targetRect, offsetTop);
|
||||||
const fixedBottom = getFixedBottom(placeholderReact, targetRect, offsetBottom);
|
const fixedBottom = getFixedBottom(placeholderReact, targetRect, offsetBottom);
|
||||||
if (fixedTop !== undefined) {
|
if (fixedTop !== undefined) {
|
||||||
|
@ -209,9 +214,9 @@ const Affix = {
|
||||||
const offsetBottom = this.getOffsetBottom();
|
const offsetBottom = this.getOffsetBottom();
|
||||||
|
|
||||||
const targetNode = target();
|
const targetNode = target();
|
||||||
if (targetNode && this.$el) {
|
if (targetNode && this.$refs.placeholderNode) {
|
||||||
const targetRect = getTargetRect(targetNode);
|
const targetRect = getTargetRect(targetNode);
|
||||||
const placeholderReact = getTargetRect(this.$el);
|
const placeholderReact = getTargetRect(this.$refs.placeholderNode);
|
||||||
const fixedTop = getFixedTop(placeholderReact, targetRect, offsetTop);
|
const fixedTop = getFixedTop(placeholderReact, targetRect, offsetTop);
|
||||||
const fixedBottom = getFixedBottom(placeholderReact, targetRect, offsetBottom);
|
const fixedBottom = getFixedBottom(placeholderReact, targetRect, offsetBottom);
|
||||||
|
|
||||||
|
@ -234,7 +239,6 @@ const Affix = {
|
||||||
const className = classNames({
|
const className = classNames({
|
||||||
[getPrefixCls('affix', prefixCls)]: affixStyle,
|
[getPrefixCls('affix', prefixCls)]: affixStyle,
|
||||||
});
|
});
|
||||||
|
|
||||||
const props = omit($props, ['prefixCls', 'offsetTop', 'offsetBottom', 'target']);
|
const props = omit($props, ['prefixCls', 'offsetTop', 'offsetBottom', 'target']);
|
||||||
return (
|
return (
|
||||||
<ResizeObserver
|
<ResizeObserver
|
||||||
|
|
|
@ -6,6 +6,7 @@ const VueResizeObserver = {
|
||||||
name: 'ResizeObserver',
|
name: 'ResizeObserver',
|
||||||
props: {
|
props: {
|
||||||
disabled: Boolean,
|
disabled: Boolean,
|
||||||
|
onResize: Function,
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
this.currentElement = null;
|
this.currentElement = null;
|
||||||
|
@ -45,12 +46,12 @@ const VueResizeObserver = {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!this.resizeObserver && element) {
|
if (!this.resizeObserver && element) {
|
||||||
this.resizeObserver = new ResizeObserver(this.onResize);
|
this.resizeObserver = new ResizeObserver(this.handleResize);
|
||||||
this.resizeObserver.observe(element);
|
this.resizeObserver.observe(element);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
onResize(entries) {
|
handleResize(entries) {
|
||||||
const { target } = entries[0];
|
const { target } = entries[0];
|
||||||
const { width, height } = target.getBoundingClientRect();
|
const { width, height } = target.getBoundingClientRect();
|
||||||
/**
|
/**
|
||||||
|
|
Loading…
Reference in New Issue