vue-preview縮略圖報錯解決
vue-preview
因為已經(jīng)更新縮略圖,使用方法已經(jīng)發(fā)生轉(zhuǎn)變,所以才會找不到$preview
控制臺錯誤信息
"$preview" is not defined on the instance but referenced during render
vue-preview(官網(wǎng))
npm i vue-preview -S
main.js引用
import VuePreview from 'vue-preview' // defalut install Vue.use(VuePreview)
css樣式
.thumbs {
/deep/ .my-gallery{ //deep深層作用選擇器
display: flex;
flex-wrap:wrap;//默認換行
figure{
width: 30%;
margin: 5px;
img{
width: 100%;
box-shadow: 0 0 8px #999;
border-radius: 5px;
}
}
}Examples
<template>
<div class="thumbs">
<vue-preview :slides="slide1" @close="handleClose"></vue-preview>
</div>
</template>
<script>
export default {
data () {
return {
slide1: [
{
src: 'https://ss3.bdstatic.com/iPoZeXSm1A5BphGlnYG/skin/414.jpg?2',
msrc: 'https://ss3.bdstatic.com/iPoZeXSm1A5BphGlnYG/skin/414.jpg?2',
alt: 'picture1',
title: 'Image Caption 1',
w: 600,
h: 400
}
]
}
},
methods: {
handleClose () {
console.log('close event')
}
}
}
</script>實際展示

以上就是vue-preview縮略圖報錯解決的詳細內(nèi)容,更多關(guān)于vue-preview縮略圖報錯的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
jquery imgareaselect 使用利用js與程序結(jié)合實現(xiàn)圖片剪切
當(dāng)前在ff3下,用jquery的 width()與height()函數(shù),在不設(shè)置圖片的寬度與高度的時候,不能取到 需要在圖片load函數(shù)里面初始化才可以2009-07-07
JQuery觸發(fā)radio或checkbox的change事件
在JQuery中,當(dāng)給radio或checkbox添加一個change事件時,如果它的值發(fā)生變化就會觸發(fā)change事件;本文將詳細介紹如何利用JQuery觸發(fā)Checkbox的change事件需要了解的朋友可以參考下2012-12-12
jquery實現(xiàn)Ajax請求的幾種常見方式總結(jié)
這篇文章主要介紹了jquery實現(xiàn)Ajax請求的幾種常見方式,結(jié)合實例形式總結(jié)分析了jQuery實現(xiàn)ajax請求常用的load()、post()、get()及Ajax()方法相關(guān)操作技巧,需要的朋友可以參考下2019-05-05
jQuery validate+artdialog+jquery form實現(xiàn)彈出表單思路詳解
在項目需求中有這樣一功能:在頁面彈出一個form表單,ajax無刷新提交表單,表單需通過驗證。下面小編給大家介紹通過jQuery validate+artdialog+jquery form實現(xiàn)彈出表單思路詳解,需要的朋友參考下吧2016-04-04
用jQuery解決IE不支持的option disable屬性
使用jQuery解決IE不支持的option disable屬性2009-05-05

