vue+viewer.js图片预览（隐藏的图片预览）

• Z时代
• 2024-01-10
• 分类：综合

css

.viewer-toolbar ul{
   display: inline-flex;
}

html

<ul ></li>
   </template>
</ul>

js

var vm = new Vue({
   el: '#files',
   data: {
      files:[]
   }
});

var viewer=null;

$.post(baseURL,{ycsb_id:ycsb_id},function (data) {
   vm.files=data.files;
   vm.$nextTick(function () {
      //$('#ycsbUl').viewer({url: 'data-original'});
      //$('#ycsbUl').viewer(0);
      if(viewer!=null&&viewer!=undefined){
         viewer.destroy();
      }
      var galley = document.getElementById('files');
      viewer = new Viewer(galley, {
         url: 'data-original',
         title: "",
         zoomable: true,
         movable: true,
         backdrop: true,
         zoomRatio: 0.4,  //鼠标滚动时的缩放比例
         tooltip: true,
         toolbar: true,
         fullscreen: false,
         button: true,
      });
      //debugger;
      viewer.view();
   });
});

以上是 vue+viewer.js图片预览（隐藏的图片预览） 的全部内容， 来源链接： utcz.com/z/377525.html