You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
58 lines
1.8 KiB
58 lines
1.8 KiB
|
|
var Swiper = require('swiper')
|
|
Swiper = Swiper.default || Swiper
|
|
var swiper = {
|
|
install: function(Vue) {
|
|
var getInstanceName = function(el, binding, vnode) {
|
|
var customInstanceName = ''
|
|
if (binding.arg) {
|
|
customInstanceName = binding.arg
|
|
} else if (vnode.data.attrs && vnode.data.attrs.instanceName) {
|
|
customInstanceName = vnode.data.attrs.instanceName
|
|
} else if (el.id) {
|
|
customInstanceName = el.id
|
|
}
|
|
var instanceName = customInstanceName || 'swiper'
|
|
return instanceName
|
|
}
|
|
Vue.directive('swiper', {
|
|
bind: function(el, binding, vnode) {
|
|
var _this = vnode.context
|
|
if (el.className.indexOf('swiper-container') === -1) {
|
|
el.className += (!!el.className ? ' ' : '' + 'swiper-container')
|
|
}
|
|
},
|
|
inserted: function(el, binding, vnode) {
|
|
var _this = vnode.context
|
|
var options = binding.value
|
|
var instanceName = getInstanceName(el, binding, vnode)
|
|
var swiper = _this[instanceName]
|
|
if (!swiper) {
|
|
_this[instanceName] = new Swiper(el, options)
|
|
}
|
|
},
|
|
componentUpdated: function(el, binding, vnode) {
|
|
var instanceName = getInstanceName(el, binding, vnode)
|
|
var swiper = vnode.context[instanceName]
|
|
if (swiper) {
|
|
swiper.update(true)
|
|
swiper.updatePagination(true)
|
|
if (binding.value.loop) {
|
|
swiper.reLoop()
|
|
}
|
|
}
|
|
},
|
|
unbind: function(el, binding, vnode) {
|
|
var instanceName = getInstanceName(el, binding, vnode)
|
|
var swiper = vnode.context[instanceName]
|
|
if (swiper) {
|
|
swiper.destroy()
|
|
delete vnode.context[instanceName]
|
|
}
|
|
}
|
|
})
|
|
}
|
|
}
|
|
|
|
module.exports = swiper
|