{"id":13424260,"url":"https://github.com/ElemeFE/vue-infinite-scroll","last_synced_at":"2025-03-15T18:34:26.422Z","repository":{"id":48510173,"uuid":"47816884","full_name":"ElemeFE/vue-infinite-scroll","owner":"ElemeFE","description":"An infinite scroll directive for vue.js.","archived":false,"fork":false,"pushed_at":"2023-11-18T15:05:15.000Z","size":37,"stargazers_count":2860,"open_issues_count":96,"forks_count":415,"subscribers_count":44,"default_branch":"master","last_synced_at":"2025-02-28T06:15:29.192Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ElemeFE.png","metadata":{"files":{"readme":"README.MD","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2015-12-11T09:19:51.000Z","updated_at":"2025-02-28T03:02:34.000Z","dependencies_parsed_at":"2024-01-23T21:24:22.925Z","dependency_job_id":"527db9b5-fac7-4970-b04f-8f2c9ba179ea","html_url":"https://github.com/ElemeFE/vue-infinite-scroll","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElemeFE%2Fvue-infinite-scroll","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElemeFE%2Fvue-infinite-scroll/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElemeFE%2Fvue-infinite-scroll/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ElemeFE%2Fvue-infinite-scroll/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ElemeFE","download_url":"https://codeload.github.com/ElemeFE/vue-infinite-scroll/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243775798,"owners_count":20346265,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-31T00:00:50.909Z","updated_at":"2025-03-15T18:34:21.403Z","avatar_url":"https://github.com/ElemeFE.png","language":"JavaScript","funding_links":[],"categories":["Awesome Vue.js [![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/sindresorhus/awesome)","JavaScript","HarmonyOS","UI组件","Components \u0026 Libraries","UI Components","UI Components [🔝](#readme)","Awesome Vue.js"],"sub_categories":["Libraries \u0026 Plugins","Windows Manager","无限滚动","UI Components","Infinite Scroll"],"readme":"# vue-infinite-scroll\n\nvue-infinite-scroll is an infinite scroll directive for vue.js.\n\n# Install\n\n```Bash\nnpm install vue-infinite-scroll --save\n```\n\n### CommonJS\n\nYou can use any build tool which supports `commonjs`:\n\n```JavaScript\n// register globally\nvar infiniteScroll =  require('vue-infinite-scroll');\nVue.use(infiniteScroll)\n\n// or for a single instance\nvar infiniteScroll = require('vue-infinite-scroll');\nnew Vue({\n  directives: {infiniteScroll}\n})\n\n```\n\nOr in ES2015:\n\n```JavaScript\n// register globally\nimport infiniteScroll from 'vue-infinite-scroll'\nVue.use(infiniteScroll)\n\n// or for a single instance\nimport infiniteScroll from 'vue-infinite-scroll'\nnew Vue({\n  directives: {infiniteScroll}\n})\n\n```\n\n### Direct include\n\nYou can use the CDN: https://unpkg.com/vue-infinite-scroll, `infiniteScroll` is exposed to `window` and will automatically install itself. Also you can use your local copy:\n\n```HTML\n\u003cscript src=\"../node_modules/vue-infinite-scroll/vue-infinite-scroll.js\"\u003e\u003c/script\u003e\n```\n\n## Usage\n\nUse v-infinite-scroll to enable the infinite scroll, and use infinite-scroll-* attributes to define its options.\n\nThe method appointed as the value of v-infinite-scroll will be executed when the bottom of the element reaches the bottom of the viewport.\n\n```HTML\n\u003cdiv v-infinite-scroll=\"loadMore\" infinite-scroll-disabled=\"busy\" infinite-scroll-distance=\"10\"\u003e\n  ...\n\u003c/div\u003e\n```\n\n```JavaScript\nvar count = 0;\n\nnew Vue({\n  el: '#app',\n  data: {\n    data: [],\n    busy: false\n  },\n  methods: {\n    loadMore: function() {\n      this.busy = true;\n\n      setTimeout(() =\u003e {\n        for (var i = 0, j = 10; i \u003c j; i++) {\n          this.data.push({ name: count++ });\n        }\n        this.busy = false;\n      }, 1000);\n    }\n  }\n});\n```\n\n# Options\n\n| Option | Description |\n| ----- | ----- |\n| infinite-scroll-disabled | infinite scroll will be disabled if the value of this attribute is true. |\n| infinite-scroll-distance | Number(default = 0) - the minimum distance between the bottom of the element and the bottom of the viewport before the v-infinite-scroll method is executed. |\n| infinite-scroll-immediate-check | Boolean(default = true) - indicates that the directive should check immediately after bind. Useful if it's possible that the content is not tall enough to fill up the scrollable container. |\n| infinite-scroll-listen-for-event | infinite scroll will check again when the event is emitted in Vue instance. |\n| infinite-scroll-throttle-delay | Number(default = 200) - interval(ms) between next time checking and this time  |\n\n## Development\n\n|Command|Description|\n|---|---|\n|npm run build|Build in umd format|\n|npm test|Lint code|\n\n# License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FElemeFE%2Fvue-infinite-scroll","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FElemeFE%2Fvue-infinite-scroll","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FElemeFE%2Fvue-infinite-scroll/lists"}