npm install v-viewer --save //安装
//在main.js中引入
import Viewer from 'v-viewer'
import 'viewerjs/dist/viewer.css'
//Vue.use(Viewer) 默认配置写法
Vue.use(Viewer, {
defaultOptions: {
zIndex: 9999
}
})
代码:
<viewer :images="previewImages">
<img v-for="src in previewImages" :src="src" :key="src" width="200">
</viewer>
data () {
return {
previewImages : []
}
},
created() {
//图片是从后台 (网络图片)
this.getData()
},
methods: {
getData() {
var _this = this
_this.$http.get('/admin/attach/product')
.then(function (response) {
_this.previewImages= response.data
.catch(function (err) {
console.log(err)
});
}
}
vue 图片预览
最新推荐文章于 2024-07-03 14:05:29 发布