ssr.js 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. var Swiper = require('swiper')
  2. Swiper = Swiper.default || Swiper
  3. var swiper = {
  4. install: function(Vue) {
  5. var getInstanceName = function(el, binding, vnode) {
  6. var customInstanceName = ''
  7. if (binding.arg) {
  8. customInstanceName = binding.arg
  9. } else if (vnode.data.attrs && vnode.data.attrs.instanceName) {
  10. customInstanceName = vnode.data.attrs.instanceName
  11. } else if (el.id) {
  12. customInstanceName = el.id
  13. }
  14. var instanceName = customInstanceName || 'swiper'
  15. return instanceName
  16. }
  17. Vue.directive('swiper', {
  18. bind: function(el, binding, vnode) {
  19. var _this = vnode.context
  20. if (el.className.indexOf('swiper-container') === -1) {
  21. el.className += (!!el.className ? ' ' : '' + 'swiper-container')
  22. }
  23. },
  24. inserted: function(el, binding, vnode) {
  25. var _this = vnode.context
  26. var options = binding.value
  27. var instanceName = getInstanceName(el, binding, vnode)
  28. var swiper = _this[instanceName]
  29. if (!swiper) {
  30. _this[instanceName] = new Swiper(el, options)
  31. }
  32. },
  33. componentUpdated: function(el, binding, vnode) {
  34. var instanceName = getInstanceName(el, binding, vnode)
  35. var swiper = vnode.context[instanceName]
  36. if (swiper) {
  37. swiper.update(true)
  38. swiper.updatePagination(true)
  39. if (binding.value.loop) {
  40. swiper.reLoop()
  41. }
  42. }
  43. },
  44. unbind: function(el, binding, vnode) {
  45. var instanceName = getInstanceName(el, binding, vnode)
  46. var swiper = vnode.context[instanceName]
  47. if (swiper) {
  48. swiper.destroy()
  49. delete vnode.context[instanceName]
  50. }
  51. }
  52. })
  53. }
  54. }
  55. module.exports = swiper