博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Ionic3 UI组件之 ImageViewer
阅读量:6542 次
发布时间:2019-06-24

本文共 632 字,大约阅读时间需要 2 分钟。

 组件特性:

  • 轻触图片可全屏查看
  • 手势上下滑动可关闭全屏查看
  • 点击导航箭头可关闭视图
  • 双击查看全图,并可放大

参考地址:https://github.com/Riron/ionic-img-viewer

==============================================================

1)安装包:

npm install --save ionic-img-viewer

2)在app.module.ts文件中增加:import { IonicImageViewerModule } from 'ionic-img-viewer';

并且在imports: [] 中增加IonicImageViewerModule;

3)在使用图片的地方增加imageViewer属性,比如:<img src="IMAGE_URL" imageViewer />

展示缩略图:<img src="IMAGE_URL" imageViewer="OTHER_IMAGE_URL" />

4)在使用此组件的过程中,发现存在问题,如下所示:

 5)猜测与自己的 ionic framework 版本有关系,修改项目中的package.json中 ionic-angular 版本号为: 3.3.0,

npm update,重新运行项目就OK了。

转载于:https://www.cnblogs.com/tomkart/p/6936602.html

你可能感兴趣的文章
Bzoj1758: [Wc2010]重建计划
查看>>
redis集群部署及踩过的坑
查看>>
j2EE监听器-listener
查看>>
使用pip命令报You are using pip version 9.0.3, however version 18.0 is available pip版本过期.解决方案...
查看>>
(转)LINQ之路
查看>>
Django REST框架--关系和超链接api
查看>>
双击防止网页放大缩小HTML5
查看>>
C#的一些学习方法
查看>>
U3D Invoke() IsInvoking CancelInvoke方法的调用
查看>>
Javascript 如何生成Less和Js的Source map
查看>>
中间有文字的分割线效果
查看>>
<悟道一位IT高管20年的职场心经>笔记
查看>>
volatile和synchronized的区别
查看>>
10.30T2 二分+前缀和(后缀和)
查看>>
vuex视频教程
查看>>
Java 线程 — ThreadLocal
查看>>
安居客爬虫(selenium实现)
查看>>
-----二叉树的遍历-------
查看>>
ACM北大暑期课培训第一天
查看>>
F. Multicolored Markers(数学思维)
查看>>