一个简单的vue图片预览组件

一个简单地图片预览组件vue-img-previewer

github页面

组件展示

使用方式

1. 安装

yarn add vue-img-previewer

npm i vue-img-previewer --save

2. 然后在要使用的组件里按照下面的类似格式书写

上面为了简单测试，直接用了require，这里可以是从后端拿到的base64数据

图片数据的格式需为
{ title: 'xxx', url: 'xxxxxx.xxx', id: x }

3. 运行

yarn serve

npm run serve

参数

名称	功能	默认值	可选值
viewerVisible	vue-previewer的可见性，必填值	null	false
imgIndex	图片的索引，必填值	null	0-~
imgDataList	图片的数据	null	数组类型按照{ title: 'xxx', url: 'xxxxxx.xxx', id: x }

组件简单，注释详细，易于第二次开发

刚学了点ts和vue做了这个组件，主要是vue的组件有点少，我搜索的时候，只看见v-viewer这个封装了 viewer.js的组件和一些功能较少的组件，不易于维护和二次开发，于是我做了这个组件，我是刚入前端的新手，希望各位指点，如果可以献上你的star和fork，小生感激不尽