如何解决React Native Redash,TypeError:this.props.onScroll不是一个函数
我遇到useValue
和interpolateColor
和onScrollEvent
的错误!
我检查了docs in github,并发现自15.0.0
版本以来,我们需要从v1导入上述内容,例如:
import { useValue } from 'react-native-redash/src/v1/Hooks'
import { interpolateColor } from 'react-native-redash/src/v1/Colors'
import { onScrollEvent } from 'react-native-redash/src/v1/Gesture'
现在开始时我没有任何错误,但是出现空白屏幕,如果尝试滚动,则会出现以下错误:
TypeError: this.props.onScroll is not a function. (In 'this.props.onScroll(e)','this.props.onScroll' is an instance of AnimatedEvent)
进口货有问题吗?
其余代码为:
const { width } = Dimensions.get('window')
export interface OnboardingProps {
}
const styles = StyleSheet.create({
container: {
flex: 1,backgroundColor: 'white'
},slider: {
height: SLIDE_HEIGHT,borderBottomrighTradius: 75
},footer: {
flex: 1
}
})
const Onboarding: React.SFC<OnboardingProps> = () => {
const x = useValue(0)
// Todo: useScrollEvent
const onScroll = onScrollEvent({ x });
const backgroundColor = interpolateColor(x,{
inputRange: [0,width,width * 2,width * 3],outputRange: ["#2ECC71","#5DADE2","#82E0AA","#5499C7"]
})
return (
<View style={styles.container}>
<Animated.View style={[styles.slider,{ backgroundColor }]}>
<Animated.ScrollView horizontal snapToInterval={width}
decelerationRate='fast' showsHorizontalScrollIndicator={false}
bounces={false}
{...{ onScroll }}
>
<Slide label='Relaxed' />
<Slide label='Playful' right />
<Slide label='Exentric' />
<Slide label='Funky' right />
</Animated.ScrollView>
</Animated.View>
<View style={styles.footer} >
<Animated.View style={{ ...StyleSheet.absoluteFillObject,backgroundColor }} >
<View style={{ flex: 1,backgroundColor: 'white',borderTopLefTradius: 75 }} ></View>
</Animated.View>
</View>
</View>
);
}
讲师(William Candillon)有Todo: useScrollEvent
字条。可能想稍后再尝试使用它代替onScrollEvent
。 useScrollEvent
在哪里找到?
使用backgroundColor的style
也出现错误:
...
const backgroundColor = interpolateColor(x,"#5499C7"]
})
...
<Animated.View style={[styles.slider,{ backgroundColor}]}>
即单词样式用红色下划线
。我使用普通颜色,错误消失了:
<Animated.View style={[styles.slider,{ backgroundColor: 'cyan'}]}>
谢谢!
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。