uniapp点击图片放大预览

简介: uniapp点击图片放大预览

阐述

  • 有些时候我们在用uniapp显示图片时,有的不宜全部显示到屏幕上,uniapp提供了一个非常好用的api。

实现方式如下:

<template>
  <view class="content">
    <image class="logo" src="/static/images/a.png" @click="clickImg"></image>
  </view>
</template>
<script>
  export default {
    methods: {
      clickImg() {
        uni.previewImage({
          urls: ["/static/images/a.png"], //需要预览的图片http链接列表,多张的时候,url直接写在后面就行了
          current: '', // 当前显示图片的http链接,默认是第一个
          success: function(res) {},
          fail: function(res) {},
          complete: function(res) {},
        })
      },
    }
  }
</script>

效果

目录
相关文章
uniapp点击图片预览功能?
uniapp点击图片预览功能?
1085 0
uniapp发送formdata表单请求(全网最简单方法)
因为uniapp不支持直接传输formdata,只提供了uploadFile方法上传文件,但是利用该方法就可以传输formdata了。
3153 1
uni-app实现swiper滑动放大缩小、实现scroll-view与swiper双向联动
uni-app实现swiper滑动放大缩小、实现scroll-view与swiper双向联动
1912 0
|
移动开发 小程序 前端开发
uniapp开发小程序H5页面顶部导航栏navigationBar如何隐藏?三种解决办法
uniapp开发小程序H5页面顶部导航栏navigationBar如何隐藏?三种解决办法
|
应用服务中间件 nginx
Nginx的启动、停止与重启
启动  启动代码格式:nginx安装目录地址 -c nginx配置文件地址 例如: [root@LinuxServer sbin]# /usr/local/nginx/sbin/nginx -c /usr/local/nginx/conf/nginx.
13553 0
|
API
uniapp点击图片放大预览
uniapp点击图片放大预览
837 0
|
SQL XML JavaScript
【若依Java】15分钟玩转若依二次开发,新手小白半小时实现前后端分离项目,springboot+vue3+Element Plus+vite实现Java项目和管理后台网站功能
摘要: 本文档详细介绍了如何使用若依框架快速搭建一个基于SpringBoot和Vue3的前后端分离的Java管理后台。教程涵盖了技术点、准备工作、启动项目、自动生成代码、数据库配置、菜单管理、代码下载和导入、自定义主题样式、代码生成、启动Vue3项目、修改代码、以及对代码进行自定义和扩展,例如单表和主子表的代码生成、树形表的实现、商品列表和分类列表的改造等。整个过程详细地指导了如何从下载项目到配置数据库,再到生成Java和Vue3代码,最后实现前后端的运行和功能定制。此外,还提供了关于软件安装、环境变量配置和代码自动生成的注意事项。
28193 73
|
小程序
uniapp 实现当前页面分享至微信好友或朋友圈功能(带参数和无参数)
uniapp 实现当前页面分享至微信好友或朋友圈功能(带参数和无参数)
2884 0
|
移动开发 小程序 前端开发
uniap开发微信小程序如何在线预览pdf文件
这是一段关于在线预览和处理PDF的多方案说明,包括使用JavaScript库PDF.js(如`pdfh5.js`)实现H5页面预览,提供QQ群和技术博客链接以获取帮助和支持。还介绍了两个适用于Uni-app的插件,一个用于H5、小程序和App中的PDF预览和下载,另一个专门解决手机端PDF预览问题。此外,还详细描述了在Uni-app中使用微信小程序API`wx.openDocument`显示PDF的步骤,包括上传文件、配置权限和编写代码。
若依修改,切换首页,改成自己想要跳转的login页
若依修改,切换首页,改成自己想要跳转的login页