ionic开发的过程中遇到的问题及解决方法的整理(一)
程序员文章站
2022-06-04 14:29:59
...
ionic 轮播无效问题
1.slides轮播图手动滑动后无法自动播放问题
在轮播所在的ts文件中引入ViewChild,Slides
import { Component, ViewChild } from '@angular/core';
import { Slides } from 'ionic-angular';
之后通过@ViewChild匹配到组件 Slides元素
@ViewChild(Slides) slides: Slides;
最后在ionViewDidEnte生命周期里设置该参数 autoplayDisableOnInteraction 为false
ionViewDidEnter() {
this.slides.autoplayDisableOnInteraction = false;
}
2.ion-slides切换页面返回后轮播失效问题
自动播放的Slides调转到其他页面一定时间后(超过设置的播放时间),再回到此页面,自动播放失效。所以可以在离开页面时停止自动播放,再次进入时再次启动。
同样首先在轮播所在的ts文件中引入ViewChild,Slides,并通过@ViewChild匹配到组件 Slides元素
import { Component, ViewChild } from '@angular/core';
import { Slides } from 'ionic-angular';
@ViewChild(Slides) slides: Slides;
之后在进入页面时用 ionViewDidEnter生命周期启动轮播
ionViewDidEnter(){
this.slides.startAutoplay();
}
最后在离开页面时调用ionViewDidLeave生命周期停止轮播
ionViewDidLeave(){
this.slides.stopAutoplay();
}
上一篇: ORACLE中SQL分页语句
下一篇: php生成word文档
推荐阅读
-
ubuntu14.04 使用中遇到的问题及解决方法集锦
-
Win7版IE10安装过程中的常见问题整理及解决
-
Win10安装mysql8.0.15 winx64及连接服务器过程中遇到的问题
-
Android开发 RadioButton使用中遇到的问题与解决方法
-
做JAVA开发的同学一定遇到过的爆表问题,看这里解决
-
WordPress迁移时一些常见问题的解决方法整理
-
一键GHOST硬盘版 gho_run.exe遇到问题需要关闭问题的解决方法
-
Win10系统安装MySQL8.0.13遇到的问题及解决方法
-
电脑提示"你的电脑遇到问题"错误的故障原因及解决方法
-
Win10系统无法开机提示您的电脑遇到问题需要重新启动的原因及解决方法