diff --git a/src/Picker.tsx b/src/Picker.tsx index d60f6a9..4251d3d 100644 --- a/src/Picker.tsx +++ b/src/Picker.tsx @@ -20,6 +20,8 @@ class Picker extends React.Component { indicatorRef: any; itemHeight: number; scrollValue: any; + // 在拖动或者动画滚动过程中,不响应 props 更新 + isMovingOrScrolling = false; scrollHanders = (() => { let scrollY = -1; @@ -112,6 +114,7 @@ class Picker extends React.Component { } isMoving = true; + this.isMovingOrScrolling = true; startY = y; lastY = scrollY; }; @@ -243,7 +246,9 @@ class Picker extends React.Component { } componentDidUpdate() { - this.props.select(this.state.selectedValue, this.itemHeight, this.scrollToWithoutAnimation); + if (!this.isMovingOrScrolling) { + this.props.select(this.state.selectedValue, this.itemHeight, this.scrollToWithoutAnimation); + } } scrollTo = (top) => { @@ -285,6 +290,7 @@ class Picker extends React.Component { } scrollingComplete = () => { + this.isMovingOrScrolling = false; const top = this.scrollHanders.getValue(); if (top >= 0) { this.props.doScrollingComplete(top, this.itemHeight, this.fireValueChange); diff --git a/src/PopupMixin.tsx b/src/PopupMixin.tsx index 74b6ea8..6bfc129 100644 --- a/src/PopupMixin.tsx +++ b/src/PopupMixin.tsx @@ -26,9 +26,19 @@ export default function PopupMixin(getModal, platformProps) { componentWillReceiveProps(nextProps) { if ('value' in nextProps) { - this.setState({ - pickerValue: nextProps.value, - }); + // value 有实际的变化才更新 + if (!Array.isArray(nextProps.value) || !Array.isArray(this.props.value)) { + // 不是数组的话,跟原来的逻辑一样,实际上 Picker 不会走到这个逻辑,因为 Picker 在使用的时候必须传数组 + this.setState({ + pickerValue: nextProps.value, + }); + } else if (nextProps.value.length !== this.props.value.length || nextProps.value.some( + (item, index) => item !== this.props.value[index] + )) { + this.setState({ + pickerValue: nextProps.value, + }); + } } if ('visible' in nextProps) { this.setVisibleState(nextProps.visible);