vant/image-preview.md at a49f1ba1ac4fab2b896348d9ee911ba646546a12

mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00

neverland 50983ca28e 依赖更新 && 构建调整 (#60 )

* upgrade dependencies

* 更改所有 saladcss 写法

* fix: 升级依赖导致的样式错误

* fix: build vant css

* use es module when pack && webpack scope hoisting

* fix: vue module version

* delete unused npm script

* fix: build:vant script not work

* fix: webpack config format

* fix: build minify vant.js

* fix: captain ui relative link

2017-07-28 11:02:33 +08:00

1.6 KiB

Raw Blame History

ImagePreview 图片预览

使用指南

ImagePreview和其他组件不同，不是通过HTML结构的方式来使用，而是通过函数调用的方式。使用前需要先引入它。

import { ImagePreview } from 'vant';

代码演示

基础用法

:::demo 基础用法

<van-button @click="handleImagePreview">预览图片</van-button>

<script>
import { ImagePreview } from 'src/index';

export default {
  methods: {
    handleImagePreview() {
      ImagePreview([
        'https://img.yzcdn.cn/upload_files/2017/03/14/FmTPs0SeyQaAOSK1rRe1sL8RcwSY.jpeg',
        'https://img.yzcdn.cn/upload_files/2017/03/15/FvexrWlG_WxtCE9Omo5l27n_mAG_.jpeg'
      ]);
    }
  }
};
</script>

:::

点击以下按钮查看手机端效果：

<van-button @click="mobileShow = true">点击查看手机端效果

方法参数

参数名	说明	类型
imageUrls	需要预览的图片	`Array`

1.6 KiB Raw Blame History Unescape Escape