Plug-end mobile image preview Vue.js
2018.01.07 13:22:17 number of words read 194 5749
vue-picture-preview
Mobile end Vue.js image preview plug | Mobile-friendly picture file preview Vue.js plugin with horizontal nav and bottom title.
installation
asl
npm install --save vue-picture-preview
use
First, at the entrance of the project file in the introduction, calling Vue.use installation.
import vuePicturePreview from 'vue-picture-preview'
Vue.use(vuePicturePreview)
Add in the root element assembly position lg-preview
<!-- Vue root compoment template -->
<div id="app">
<router-view></router-view>
<lg-preview></lg-preview>
</div>
All images can be used for v-preview command to bind their preview
<img v-for="img in imgs" v-preview="img" :src="img">
export default {
data () {
return {
imgs: ['http://covteam.u.qiniudn.com/ka2.jpg', 'http://covteam.u.qiniudn.com/poster.png']
}
}
}
API
isTitleEnable: (boolean, optional) provided isTitleEnable = "false" level to disable the navigation Default:. true.
isHorizontalNavEnable: (boolean, optional) set isHorizontalNavEnable = "false" will disable the bottom of the title defaults:. true.
5 people thumbs up
