ReactNative定时器和ScrollView组件

作者: 遛遛食 | 来源:发表于2019-08-06 15:42 被阅读1次

    定时器

    最新的定时器与网页的定时器使用基本一致。
    time为时间间隔单位ms

    Interval为每隔多长时间执行一次

    //创建
    self.timer = setInterval(() => {
          要执行的代码
    }, time);
    
    //销毁
    clearInterval(self.timer)
    

    Timeout只会执行一次

    //创建
    self.timer = setTimeout(() => {
          要执行的代码
    }, time);
    
    //销毁
    clearTimeout(self.timer)
    
    注意:在页面销毁的时候一定要把定时器关闭
    componentWillUnmount() {
        // 如果存在this.timer,则使用clearTimeout清空。
        // 如果你使用多个timer,那么用多个变量,或者用个数组来保存引用,然后逐个clear
        this.timer && clearTimeout(this.timer);
      }
    

    ScrollerView组件

    <ScrollerView style={样式}>
    </ScrollerView >
    

    属性:
    horizontal={true}:默认为false,此属性为true是表示为横向滚动
    alwaysBounceVertical:此属性为true时垂直内容比滚动试图小时也可以弹性的拉动一截,Bounce为弹性的意思
    contentContainerStyle:控制紧跟着ScrollView的层的样式
    keyboardDismissMode:用户拖动视图时,是否要隐藏软键盘
    'none' (默认值),拖拽时不隐藏软键盘。
    'on-drag',当拖拽开始的时候隐藏软键盘。
    showsHorizontalScrollIndicator:此属性为true时,显示一个水平方向的滚动条
    showsVerticalScrollIndicator:此属性为true时显示一个垂直方向的滚动条

    方法:

    onMomentumScrollEnd:当一帧滚动完毕的时候调用,e.g. nativeEvent.contentOffset。
    onScrollBeginDrag:当开始手动拖拽的时候调用。
    onScrollEndDrag:当结束手动拖拽的时候调用。
    

    注意:
    1.必须有一个确定的高度
    2.有些属性为iOS特有属性

    相关文章

      网友评论

        本文标题:ReactNative定时器和ScrollView组件

        本文链接:https://www.haomeiwen.com/subject/vmxwdctx.html