搜索文件 /

离子复习

进修在内容组件上提供拉动刷新功能。拉到刷新模式允许用户使用触摸向下拉下数据列表,以便检索更多数据。

应在进展过程中修改数据。一旦异步操作完成并且刷新应该结束,请致电 完全的() 在进修上。

用法


                <! - 默认修复 - >
               
                  <
                 离子内容
                 >
               
                  <
                 离子复习
                
                 投币口
                  =
                  
                 固定的
                  
                
                 (ionRefresh)
                  =
                  
                 DOREFRESH($活动)
                  
                 >
               
                  <
                 离子进修含量
                 >
                  
                 离子进修含量
                 >
               
                  
                 离子复习
                 >
               
                  
                 离子内容
                 >
               
                <! - 自定义进修属性 - >
               
                  <
                 离子内容
                 >
               
                  <
                 离子复习
                
                 投币口
                  =
                  
                 固定的
                  
                
                 拉动器
                  =
                  
                 0.5
                  
                
                 拉蛋白
                  =
                  
                 100.
                  
                
                 Pullmax.
                  =
                  
                 200.
                  
                 >
               
                  <
                 离子进修含量
                 >
                  
                 离子进修含量
                 >
               
                  
                 离子复习
                 >
               
                  
                 离子内容
                 >
               
                <! - 自定义复习内容 - >
               
                  <
                 离子内容
                 >
               
                  <
                 离子复习
                
                 投币口
                  =
                  
                 固定的
                  
                
                 (ionRefresh)
                  =
                  
                 DOREFRESH($活动)
                  
                 >
               
                  <
                 离子进修含量
                
                 拉明顿
                  =
                  
                 箭头下拉
                  
                
                 拉丁文
                  =
                  
                 拉动刷新
                  
                
                 reasthingspinner.
                  =
                  
                 
                  
                
                 refreshingText.
                  =
                  
                 刷新......
                  
                 >
               
                  
                 离子进修含量
                 >
               
                  
                 离子复习
                 >
               
                  
                 离子内容
                 >

                进口
               
                {
               零件
                }
               
                
               
                '@ Angular / Core'
                ;
               @
                零件
                
                {
               选择器
                
               
                '修复 - 典型'
                
               templateURL.
                
               
                'refrever-example.html'
                
               样式堡垒
                
               
                [
                './refresher-example.css'
                ]
                
               
                }
                的)
               
                出口
               
                班级
               
                refresherexample.
               
                {
               
                构造函数
                
                的)
               
                {
                }
               
                昏昏欲睡
                
                事件
                的)
               
                {
               
                安慰
                
                日志
                
                '开始异步操作'
                的)
                ;
               
                索取
                
                
                的)
               
                =>
               
                {
               
                安慰
                
                日志
                
                '异步操作已结束'
                的)
                ;
               事件
                
               目标
                
                完全的
                
                的)
                ;
               
                }
                
               
                2000年
                的)
                ;
               
                }
               
                }

                <! - 默认修复 - >
               
                  <
                 离子内容
                 >
               
                  <
                 离子复习
                
                 投币口
                  =
                  
                 固定的
                  
                 >
               
                  <
                 离子进修含量
                 >
                  
                 离子进修含量
                 >
               
                  
                 离子复习
                 >
               
                  
                 离子内容
                 >
               
                <! - 自定义进修属性 - >
               
                  <
                 离子内容
                 >
               
                  <
                 离子复习
                
                 投币口
                  =
                  
                 固定的
                  
                
                 拉动因子
                  =
                  
                 0.5
                  
                
                 拉米
                  =
                  
                 100.
                  
                
                 拉动最大
                  =
                  
                 200.
                  
                 >
               
                  <
                 离子进修含量
                 >
                  
                 离子进修含量
                 >
               
                  
                 离子复习
                 >
               
                  
                 离子内容
                 >
               
                <! - 自定义复习内容 - >
               
                  <
                 离子内容
                 >
               
                  <
                 离子复习
                
                 投币口
                  =
                  
                 固定的
                  
                 >
               
                  <
                 离子进修含量
                
                 拉图标
                  =
                  
                 箭头下拉
                  
                
                 拉文文本
                  =
                  
                 拉动刷新
                  
                
                 刷新旋转器
                  =
                  
                 
                  
                
                 刷新文本
                  =
                  
                 刷新......
                  
                 >
               
                  
                 离子进修含量
                 >
               
                  
                 离子复习
                 >
               
                  
                 离子内容
                 >

                进口
               反应
                
               
                '反应'
                ;
               
                进口
               
                {
               离子联系
                
               IonRefresher.
                
               IonRefreshercontent
                }
               
                
               
                '@betway东盟体育app离子/反应'
                ;
               
                进口
               
                {
               refreshereventdetail.
                }
               
                
               
                '@betway东盟体育app离子/核心'
                ;
               
                功能
               
                昏昏欲睡
                
               事件
                
               CustomEvent.
                  <
                  refreshereventdetail.
                 >
                的)
                {
               
                安慰
                
                日志
                
                '开始异步操作'
                的)
                ;
               
                索取
                
                
                的)
               
                =>
               
                {
               
                安慰
                
                日志
                
                '异步操作已结束'
                的)
                ;
               事件
                
               细节
                
                完全的
                
                的)
                ;
               
                }
                
               
                2000年
                的)
                ;
               
                }
                导出const refresherexample:ract.fc =()=>(
                  <
                  离子联系
                 >
                
                {
                / *  - 默认进修 -  * /
                }
                
                  <
                  离子联系
                 >
                
                  <
                  IonRefresher.
                
                 投币口
                  =
                  
                 固定的
                  
                
                 onionrefresh.
                  =
                  {
                 昏昏欲睡
                  }
                 >
                
                  <
                  IonRefreshercontent
                 >
                  
                  IonRefreshercontent
                 >
                
                  
                  IonRefresher.
                 >
                
                  
                  离子联系
                 >
                
                {
                / *  - 自定义进修属性 -  * /
                }
                
                  <
                  离子联系
                 >
                
                  <
                  IonRefresher.
                
                 投币口
                  =
                  
                 固定的
                  
                
                 onionrefresh.
                  =
                  {
                 昏昏欲睡
                  }
                
                 拉动器
                  =
                  {
                  0.5
                  }
                
                 拉蛋白
                  =
                  {
                  100.
                  }
                
                 Pullmax.
                  =
                  {
                  200.
                  }
                 >
                
                  <
                  IonRefreshercontent
                 >
                  
                  IonRefreshercontent
                 >
                
                  
                  IonRefresher.
                 >
                
                  
                  离子联系
                 >
                
                {
                / *  - 自定义进修内容 -  * /
                }
                
                  <
                  离子联系
                 >
                
                  <
                  IonRefresher.
                
                 投币口
                  =
                  
                 固定的
                  
                
                 onionrefresh.
                  =
                  {
                 昏昏欲睡
                  }
                 >
                
                  <
                  IonRefreshercontent
                
                 拉明顿
                  =
                  
                 箭头下拉
                  
                
                 拉丁文
                  =
                  
                 拉动刷新
                  
                
                 reasthingspinner.
                  =
                  
                 
                  
                
                 refreshingText.
                  =
                  
                 刷新......
                  
                 >
                
                  
                  IonRefreshercontent
                 >
                
                  
                  IonRefresher.
                 >
                
                  
                  离子联系
                 >
                
                  
                  离子联系
                 >
                );

                  <
                 模板
                 >
               
                <! - 默认修复 - >
               
                  <
                 离子内容
                 >
               
                  <
                 离子复习
                
                 投币口
                  =
                  
                 固定的
                  
                
                 @ionrefresh.
                  =
                  
                 DOREFRESH($活动)
                  
                 >
               
                  <
                 离子进修含量
                 >
                  
                 离子进修含量
                 >
               
                  
                 离子复习
                 >
               
                  
                 离子内容
                 >
               
                <! - 自定义进修属性 - >
               
                  <
                 离子内容
                 >
               
                  <
                 离子复习
                
                 投币口
                  =
                  
                 固定的
                  
                
                 拉动因子
                  =
                  
                 0.5
                  
                
                 拉米
                  =
                  
                 100.
                  
                
                 拉动最大
                  =
                  
                 200.
                  
                 >
               
                  <
                 离子进修含量
                 >
                  
                 离子进修含量
                 >
               
                  
                 离子复习
                 >
               
                  
                 离子内容
                 >
               
                <! - 自定义复习内容 - >
               
                  <
                 离子内容
                 >
               
                  <
                 离子复习
                
                 投币口
                  =
                  
                 固定的
                  
                
                 @ionrefresh.
                  =
                  
                 DOREFRESH($活动)
                  
                 >
               
                  <
                 离子进修含量
                
                 拉图标
                  =
                  
                 箭头下拉
                  
                
                 拉文文本
                  =
                  
                 拉动刷新
                  
                
                 刷新旋转器
                  =
                  
                 
                  
                
                 刷新文本
                  =
                  
                 刷新......
                  
                 >
               
                  
                 离子进修含量
                 >
               
                  
                 离子复习
                 >
               
                  
                 离子内容
                 >
               
                  
                 模板
                 >
               
                  <
                 脚本
                
                 l
                  =
                  
                 TS.
                  
                 >
                 
                  进口
                 
                  {
                 零件
                  
                 Vue.
                  }
                 
                  
                 
                  'Vue-property-decorator'
                  ;
                 @
                  零件
                  
                  的)
                 
                  出口
                 
                  默认
                 
                  班级
                 
                  例子
                 
                  延伸
                 
                  Vue.
                 
                  {
                 
                  昏昏欲睡
                  
                  事件
                  的)
                 
                  {
                 安慰
                  
                  日志
                  
                  '开始异步操作'
                  的)
                  ;
                 
                  索取
                  
                  
                  的)
                 
                  =>
                 
                  {
                 安慰
                  
                  日志
                  
                  '异步操作已结束'
                  的)
                  ;
                 事件
                  
                 目标
                  
                  完全的
                  
                  的)
                  ;
                 
                  }
                  
                 
                  2000年
                  的)
                  ;
                 
                  }
                 
                  }
                 
                  
                 脚本
                 >

特性

关闭

描述

关闭进修需要的时间。

属性 关闭持续时间
类型 细绳
默认 '280ms'

禁用

描述

如果真的,进修将被隐藏。

属性 禁用
类型 布尔
默认 错误的

拉动器

描述

乘以拉速多少钱。为了减慢拉动动画,通过不到的数字1。加快拉动,通过大于的数字1。默认值是1这等于光标的速度。如果通过负值,则将是1反而。

例如:如果传递的值是1.2并且内容被拖动10.像素,而不是10.像素将被拉动内容12.像素(增加20%)。如果通过的价值是0.8,拖累金额将是8.像素,小于光标移动的量。

属性 拉动因子
类型 数字
默认 1

Pullmax.

描述

拉动直到进修直到进入的最大距离会自动进入刷新状态。默认为结果Pullmin + 60.

属性 拉动最大
类型 数字
默认 这个.Pullmin + 60.

拉蛋白

描述

用户必须拉下去直到进入的最小距离刷新状态。

属性 拉米
类型 数字
默认 60.

snapbackduration.

描述

时间需要重新开始刷新状态。

属性 循环持续时间
类型 细绳
默认 '280ms'

事件

姓名 描述
IonPull. 当用户拉下内容并曝光进刷时发出。
IonRefresh. 当用户允许进入内容并将其拉下来,而不是“Pullmin”或将内容拉下来并超过PullMax。更新进修状态到“刷新”。当异步操作完成时,应调用`complete()`方法。
Ionstart. 当用户开始开始拉动时发出。

方法

取消

描述

改变了进一步的状态刷新取消

签名 取消()=>承诺

完全的

描述

称呼完全的()当您的异步操作已完成时。例如刷新状态在于应用程序执行异步操作,例如从Ajax请求接收更多数据。收到数据后,您将调用此方法以表示刷新已完成并关闭进修。这种方法还改变了进一步的州刷新完成

签名 完整()=>承诺

GetProgress.

描述

表示用户拉下来的数字。号码0.代表用户根本没有下拉。号码1,任何大于1,表示用户已经向下拉动,当他们放手时,刷新就会发生。如果他们放手,这个数字就小于1,然后不会发生刷新,内容将返回它的原始位置。

签名 getProgress()=> promise
查看来源
Baidu