Use the first props change while a transition is occuring as the basis of the queued transition
- Subsequent changes are essentially all ignored except for the last one, which is the target
This commit is contained in:
parent
41af8e1451
commit
250950d920
|
@ -51,6 +51,7 @@ class Transitioner extends React.Component {
|
||||||
|
|
||||||
this._prevTransitionProps = null;
|
this._prevTransitionProps = null;
|
||||||
this._transitionProps = buildTransitionProps(props, this.state);
|
this._transitionProps = buildTransitionProps(props, this.state);
|
||||||
|
|
||||||
this._isMounted = false;
|
this._isMounted = false;
|
||||||
this._isTransitionRunning = false;
|
this._isTransitionRunning = false;
|
||||||
this._queuedTransition = null;
|
this._queuedTransition = null;
|
||||||
|
@ -68,8 +69,8 @@ class Transitioner extends React.Component {
|
||||||
|
|
||||||
// eslint-disable-next-line react/no-deprecated
|
// eslint-disable-next-line react/no-deprecated
|
||||||
componentWillReceiveProps(nextProps) {
|
componentWillReceiveProps(nextProps) {
|
||||||
if (this._isTransitionRunning) {
|
if (this._isTransitionRunning && !this._queuedTransition) {
|
||||||
this._queuedTransition = { nextProps, props: this.props };
|
this._queuedTransition = { prevProps: this.props };
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -113,15 +114,6 @@ class Transitioner extends React.Component {
|
||||||
};
|
};
|
||||||
|
|
||||||
_startTransition(nextProps, nextScenes, indexHasChanged) {
|
_startTransition(nextProps, nextScenes, indexHasChanged) {
|
||||||
if (!nextScenes) {
|
|
||||||
console.log({
|
|
||||||
nextScenes,
|
|
||||||
scenes: this.state.scenes.map(s => s.descriptor.navigation.state.routeName),
|
|
||||||
state: nextProps.navigation.state.routes.length,
|
|
||||||
indexHasChanged,
|
|
||||||
})
|
|
||||||
nextScenes = this.state.scenes;
|
|
||||||
}
|
|
||||||
const nextState = {
|
const nextState = {
|
||||||
...this.state,
|
...this.state,
|
||||||
scenes: nextScenes,
|
scenes: nextScenes,
|
||||||
|
@ -143,6 +135,7 @@ class Transitioner extends React.Component {
|
||||||
// compute transitionProps
|
// compute transitionProps
|
||||||
this._prevTransitionProps = this._transitionProps;
|
this._prevTransitionProps = this._transitionProps;
|
||||||
this._transitionProps = buildTransitionProps(nextProps, nextState);
|
this._transitionProps = buildTransitionProps(nextProps, nextState);
|
||||||
|
|
||||||
let { isTransitioning } = this._transitionProps.navigation.state;
|
let { isTransitioning } = this._transitionProps.navigation.state;
|
||||||
|
|
||||||
// if the state isn't transitioning that is meant to signal that we should
|
// if the state isn't transitioning that is meant to signal that we should
|
||||||
|
@ -291,22 +284,19 @@ class Transitioner extends React.Component {
|
||||||
|
|
||||||
if (this._queuedTransition) {
|
if (this._queuedTransition) {
|
||||||
const indexHasChanged =
|
const indexHasChanged =
|
||||||
this._queuedTransition.nextProps.navigation.state.index !==
|
this.props.navigation.state.index !==
|
||||||
this._queuedTransition.props.navigation.state.index;
|
this._queuedTransition.prevProps.navigation.state.index;
|
||||||
let nextScenes = this._computeScenes(
|
let nextScenes = this._computeScenes(
|
||||||
this._queuedTransition.props,
|
this._queuedTransition.prevProps,
|
||||||
this._queuedTransition.nextProps
|
this.props
|
||||||
);
|
);
|
||||||
|
|
||||||
if (nextScenes) {
|
if (nextScenes) {
|
||||||
this._startTransition(
|
this._startTransition(this.props, nextScenes, indexHasChanged);
|
||||||
this._queuedTransition.nextProps,
|
} else {
|
||||||
nextScenes,
|
this._isTransitionRunning = false;
|
||||||
indexHasChanged
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
this._queuedTransition = null;
|
this._queuedTransition = null;
|
||||||
this._isTransitionRunning = false;
|
|
||||||
} else {
|
} else {
|
||||||
this._isTransitionRunning = false;
|
this._isTransitionRunning = false;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue