vue-view-photo v0.0.4

vue-view-photo

基于swiper5开发的vue图片浏览插件。支持图片组预览，图片组属性preview值一样为同组，参见2.2例子；

安装使用

# 1.安装
npm install vue-view-photo 

# 2.使用
2.1.在js引用ViewPhoto组件与定义viewPhoto()方法；
 <script>
 	import ViewPhoto from 'vue-view-photo/src/components/ViewPhoto.vue';
 
 	export default {
 		
 		components: {
 			ViewPhoto
 		},
 
 		methods: {
 			viewPhoto() {
 				this.$refs.vphoto.preview();
 
 			}
 		}
 	};
 </script>
2.2引入ViewPhoto组件，调用方法@click="viewPhoto"（父元素添加事件）
<ViewPhoto ref="vphoto"></ViewPhoto>
例：
<div class="img-box" @click="viewPhoto">
	<img src="https://picsum.photos/310/310" data-src="https://picsum.photos/411/412" preview="2" preview-text="描述文字" />
	<img src="https://picsum.photos/310/310" data-src="https://picsum.photos/511/511" preview="2" preview-text="描述文字" />
	<img src="https://picsum.photos/310/310" data-src="https://picsum.photos/412/413" preview="2" preview-text="描述文字" />
	<img src="https://picsum.photos/310/310" data-src="https://picsum.photos/514/515" preview="2" preview-text="描述文字" />
</div>		
<ViewPhoto ref="vphoto"></ViewPhoto>


# 3.demo，具体使用参见App.vue（目录：/src/App.vue）.