项目原始demo,不改动
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.
Ce dépôt est archivé. Vous pouvez voir les fichiers et le cloner, mais vous ne pouvez pas pousser ni ouvrir de ticket/demande d'ajout.

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. // Mixins
  2. import Toggleable from '../../mixins/toggleable'; // Directives
  3. import intersect from '../../directives/intersect'; // Utilities
  4. import mixins from '../../util/mixins';
  5. import { convertToUnit, getSlot } from '../../util/helpers';
  6. export default mixins(Toggleable).extend({
  7. name: 'VLazy',
  8. directives: {
  9. intersect
  10. },
  11. props: {
  12. minHeight: [Number, String],
  13. options: {
  14. type: Object,
  15. // For more information on types, navigate to:
  16. // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
  17. default: () => ({
  18. root: undefined,
  19. rootMargin: undefined,
  20. threshold: undefined
  21. })
  22. },
  23. tag: {
  24. type: String,
  25. default: 'div'
  26. },
  27. transition: {
  28. type: String,
  29. default: 'fade-transition'
  30. }
  31. },
  32. computed: {
  33. styles() {
  34. return {
  35. minHeight: parseInt(this.minHeight) ? convertToUnit(this.minHeight) : this.minHeight
  36. };
  37. }
  38. },
  39. methods: {
  40. genContent() {
  41. const slot = getSlot(this);
  42. /* istanbul ignore if */
  43. if (!this.transition) return slot;
  44. const children = [];
  45. if (this.isActive) children.push(slot);
  46. return this.$createElement('transition', {
  47. props: {
  48. name: this.transition
  49. }
  50. }, children);
  51. },
  52. onObserve(entries, observer, isIntersecting) {
  53. if (this.isActive) return;
  54. this.isActive = isIntersecting;
  55. }
  56. },
  57. render(h) {
  58. return h(this.tag, {
  59. staticClass: 'v-lazy',
  60. attrs: this.$attrs,
  61. directives: [{
  62. name: 'intersect',
  63. value: {
  64. handler: this.onObserve,
  65. options: this.options
  66. }
  67. }],
  68. on: this.$listeners,
  69. style: this.styles
  70. }, [this.genContent()]);
  71. }
  72. });
  73. //# sourceMappingURL=VLazy.js.map