错误是:RCTLayoutAnimationGroup期望时间以毫秒为单位,而不是秒
当我快速向下拖动键盘时会发生这种情况.有时候这种情况会发生;有时它没有.
我在KeyboardAvoidingView中使用一个简单的TextInput组件
向您的ScrollView添加退回= {false}似乎可以解决问题.
<ScrollView keyboardDismissMode="interactive" bounces={false}>
它稍微改变了行为但是,错误似乎不再出现了.
我想如果你想保持ScrollView的’弹性’行为,最好的方法是让’弹跳’依赖于键盘节目.显示键盘时,弹跳设置为false.看看我的示例组件:
export default class App extends Component<Props> { constructor(){ super(); this.state = { bounces: true } this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide',this._keyboardDidHide.bind(this)); this.keyboardDidShowListener = Keyboard.addListener('keyboardDidShow',this._keyboardDidShow.bind(this)); } _keyboardDidShow(){ this.setState({bounces: false}); } _keyboardDidHide(){ this.setState({bounces: true}); } render() { return ( <KeyboardAvoidingView style={styles.container} behavior="padding" enabled> <ScrollView keyboardDismissMode="interactive" bounces={this.state.bounces}> <TextInput style={{height: 40,width: 150,borderColor: 'gray',borderWidth: 1}} /> </ScrollView> </KeyboardAvoidingView> ); } }
编辑:
当RNT小于10(ms)时,RNT hack将覆盖持续时间.对你来说应该改变:node_modules / react-native / Libraries / Components / Keyboard / KeyboardAvoidingView.js方法:scheduleLayoutAnimation change:
const {duration,easing,endCoordinates} = event;
至:
let {duration,endCoordinates} = event;
并添加:
if(duration < 10){ duration = 10; }
在if(duration&& easing)条件中.
这将确保最短的持续时间为1毫秒而且永远不会减少,因此持续时间不会再被抛出.
我的KeyboardAvoidingView.js,_ onKeyboardChange方法看起来像这样:
_onKeyboardChange = (event: ?KeyboardEvent) => { if (event == null) { this.setState({bottom: 0}); return; } let {duration,endCoordinates} = event; const height = this._relativeKeyboardHeight(endCoordinates); if (this.state.bottom === height) { return; } if (duration && easing) { if(duration < 10){ duration = 10; } LayoutAnimation.configureNext({ duration: duration,update: { duration: duration,type: LayoutAnimation.Types[easing] || 'keyboard',},}); } this.setState({bottom: height}); };
编辑2:
我向RNT团队提交了一个问题,并向他们开了一个公关:https://github.com/facebook/react-native/pull/21858