查看圖片詳情,放大圖片
使用方法:
1.安裝
npm install vue-photo-preview --save
2.引入(全局或局部)
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中)
//在img標簽添加preview屬性 preview值相同即表示為同一組 <img src="xxx.jpg" preview="0" preview-text="描述文字"> //分組 <img src="xxx.jpg" preview="1" preview-text="描述文字"> <img src="xxx.jpg" preview="1" preview-text="描述文字"> <img src="xxx.jpg" preview="2" preview-text="描述文字"> <img src="xxx.jpg" preview="2" preview-text="描述文字"> <img src="xxx.jpg" large="xxx_3x.jpg" preview="2" preview-text="縮略圖與大圖模式">