vue-photo-preview function for larger image

View picture details, Zoom

Instructions:

1. Install

npm install vue-photo-preview --save

2. Introduction (global or local)

import preview from 'vue-photo-preview'
import 'vue-photo-preview/dist/vue-photo-preview'
import 'vue-photo-preview/dist/skin.css'
Vue.use(preview);

3. (template) is

// add preview preview attribute value means that the same label img same group 
<img src = "xxx.jpg" preview = "0" preview-text = " text description"> // packet 
<img src = "xxx.jpg "preview =" 1 "preview- text =" text description "> 
<IMG the src =" XXX.jpg "preview =" 1 "preview- text =" text description "> 
<IMG the src =" XXX.jpg "preview =" 2 "preview-text =" text description "> 
<IMG the src =" XXX.jpg "preview =" 2 "preview-text =" text description "> 
<IMG the src =" XXX.jpg "Large =" xxx_3x.jpg " preview = "2" preview-text = " big picture thumbnail mode">



 

Guess you like

Origin www.cnblogs.com/zhaohui-116/p/12236280.html