Vue-- vue-preview（图片查看器）的使用步骤：

vue-preview的使用步骤：
        ）下载
        ）配置：找到配置文件加入：
            {
                test: /vue-preview.src.*?js$/,
                loader: 'babel-loader'
            },
            在处理url（）请求的配置中加入：svg的配置
            {
                test: /\.(jpg|png|gif|ttf|svg)$/,
                loader: "url-loader?limit=40000"
            }
        ）在main.js加载：
            //引入veu-preview
            import VuePreview from 'vue-preview'
            //使用vue-preview
            Vue.use(VuePreview)
        ）在tamplate中引入html代码：
            <img class="preview-img" v-for="(item, index) in list" :src="item.src" height="" @click="$preview.open(index, list)">
        ）得到list数据
            格式：
                 list: [{
                    src: 'https://placekitten.com/600/400',
                    w: ,
                    h:
                    }, {
                    src: 'https://placekitten.com/1200/900',
                    w: ,
                    h:
                    }]

使用链接：https://www.npmjs.com/package/vue-preview/

vue的template代码:

script代码:

效果：