vue中使用viewer查看图片插件注意事项

【HTML部分】

        <div  id="imgContainer">

               <img :src="item.img" v-for="item in imgArr">

        </div>

【JS部分】

    data:{

        viewer:null,

    },

 

    this. $nextTick(() => {

            //动态添加图片需要更新viewer插件:

            if ( this. viewer) {

                this. viewer. destroy();

            }

            this. viewer = self. $viewer(

                document. getElementById( "imgContainer")

            );

    });

1.在vue中经常会使用v-if,可能会导致document . getElementById获取不到element,

报错：Error: The first argument is required and must be an element.

解决：v-if 换为 v-show

2.动态添加图片时，需要销毁viewer插件对象this . viewer，然后再次获取图片外层容器元素,作为viewer插件初始化函数的第一个参数