github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: Auto complete dropdown flickers #1327

pull/1353/head
tangjinzhou 2019-10-25 00:04:47 +08:00
parent 88a9845ddc
commit 1208649a9e
2 changed files with 19 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/_util/css-animation/index.js
View File

@ -54,7 +54,7 @@ function clearBrowserBugTimeout(node) {
const cssAnimation = (node, transitionName, endCallback) => { const cssAnimation = (node, transitionName, endCallback) => {
const nameIsObj = typeof transitionName === 'object'; const nameIsObj = typeof transitionName === 'object';
const className = nameIsObj ? transitionName.name : transitionName; const className = nameIsObj ? transitionName.name : transitionName;
const activeClassName = nameIsObj ? transitionName.active : `${transitionName}-active`; const activeClassName = nameIsObj ? transitionName.active : `${transitionName} ${transitionName}-active`;
let end = endCallback; let end = endCallback;
let start; let start;
let active; let active;
@ -83,7 +83,10 @@ const cssAnimation = (node, transitionName, endCallback) => {
clearBrowserBugTimeout(node); clearBrowserBugTimeout(node);
nodeClasses.remove(className); nodeClasses.remove(className);
nodeClasses.remove(activeClassName); activeClassName.split(' ').forEach((className)=>{
nodeClasses.remove(className);
});
//nodeClasses.remove(activeClassName);
Event.removeEndEventListener(node, node.rcEndListener); Event.removeEndEventListener(node, node.rcEndListener);
node.rcEndListener = null; node.rcEndListener = null;
@ -104,7 +107,10 @@ const cssAnimation = (node, transitionName, endCallback) => {
node.rcAnimTimeout = requestAnimationTimeout(() => { node.rcAnimTimeout = requestAnimationTimeout(() => {
node.rcAnimTimeout = null; node.rcAnimTimeout = null;
nodeClasses.add(activeClassName); // nodeClasses.add(activeClassName);
activeClassName.split(' ').forEach((className)=>{
nodeClasses.add(className);
});
if (active) { if (active) {
requestAnimationTimeout(active, 0); requestAnimationTimeout(active, 0);
} }

11
components/vc-trigger/Popup.jsx
View File

@ -30,6 +30,7 @@ export default {
}), }),
}, },
data() { data() {
this.domEl = null;
return { return {
// Used for stretch // Used for stretch
stretchChecked: false, stretchChecked: false,
@ -43,6 +44,12 @@ export default {
this.setStretchSize(); this.setStretchSize();
}); });
}, },
beforeUpdate() {
if(this.domEl && this.domEl.rcEndListener) {
this.domEl.rcEndListener();
this.domEl = null;
}
},
updated() { updated() {
this.$nextTick(() => { this.$nextTick(() => {
this.setStretchSize(); this.setStretchSize();
@ -209,19 +216,21 @@ export default {
const transitionEvent = { const transitionEvent = {
beforeEnter: () => { beforeEnter: () => {
// el.style.display = el.__vOriginalDisplay // el.style.display = el.__vOriginalDisplay
// this.$refs.alignInstance.forceAlign() // this.$refs.alignInstance.forceAlign();
}, },
enter: (el, done) => { enter: (el, done) => {
// align updated后执行动画 // align updated后执行动画
this.$nextTick(() => { this.$nextTick(() => {
if (this.$refs.alignInstance) { if (this.$refs.alignInstance) {
this.$refs.alignInstance.$nextTick(() => { this.$refs.alignInstance.$nextTick(() => {
this.domEl = el;
animate(el, `${transitionName}-enter`, done); animate(el, `${transitionName}-enter`, done);
}); });
} }
}); });
}, },
leave: (el, done) => { leave: (el, done) => {
this.domEl = null;
animate(el, `${transitionName}-leave`, done); animate(el, `${transitionName}-leave`, done);
}, },
}; };