{"id":16489129,"url":"https://github.com/thundernet8/react-limited-infinite-scroll","last_synced_at":"2025-03-21T07:31:23.852Z","repository":{"id":57333919,"uuid":"88458639","full_name":"thundernet8/React-Limited-Infinite-Scroll","owner":"thundernet8","description":"A limited infinite scroll component for React(React有限无限加载组件)","archived":false,"fork":false,"pushed_at":"2017-06-27T14:01:34.000Z","size":39,"stargazers_count":37,"open_issues_count":0,"forks_count":11,"subscribers_count":6,"default_branch":"master","last_synced_at":"2024-04-14T04:30:30.427Z","etag":null,"topics":["infinite-scroll","react","react-component"],"latest_commit_sha":null,"homepage":"http://wuxueqian.github.io/demo/react-limited-infinite-scroll/#/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/thundernet8.png","metadata":{"files":{"readme":"README-CN.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-04-17T02:19:40.000Z","updated_at":"2019-12-31T05:48:06.000Z","dependencies_parsed_at":"2022-09-01T11:30:38.737Z","dependency_job_id":null,"html_url":"https://github.com/thundernet8/React-Limited-Infinite-Scroll","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thundernet8%2FReact-Limited-Infinite-Scroll","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thundernet8%2FReact-Limited-Infinite-Scroll/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thundernet8%2FReact-Limited-Infinite-Scroll/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thundernet8%2FReact-Limited-Infinite-Scroll/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/thundernet8","download_url":"https://codeload.github.com/thundernet8/React-Limited-Infinite-Scroll/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244757715,"owners_count":20505458,"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":["infinite-scroll","react","react-component"],"created_at":"2024-10-11T13:43:10.681Z","updated_at":"2025-03-21T07:31:23.593Z","avatar_url":"https://github.com/thundernet8.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[English README](README.md)\n\n## Limited Infinite Scroll\n\nReact无限滚动加载组件，加载一定分页后改为手动加载器(因为有些用户不喜欢永远无限加载，可能他们只是想看Footer)\n\n[Demo](http://wuxueqian.github.io/demo/react-limited-infinite-scroll/#/)\n\n## 安装\n\n```\nnpm install react-limited-infinite-scroll --save-dev\n```\n\n## 使用\n```\nimport LimitedInfiniteScroll from 'react-limited-infinite-scroll'\n\nconst { total, list } = this.props.data\n\nconst items = list.map((item, index) =\u003e {\n    return (\n        \u003cdiv key={index}\u003e\n            \u003cdiv\u003eitem content\u003c/div\u003e\n        \u003c/div\u003e\n    )\n})\n\n\u003cLimitedInfiniteScroll \n    limit={5} \n    hasMore={total === undefined || items.length \u003c total}\n    spinLoader={\u003cdiv className=\"loader\"\u003eLoading...\u003c/div\u003e}\n    mannualLoader={\u003cspan style={{fontSize: 20, lineHeight: 1.5, marginTop: 20, marginBottom: 20, display: 'inline-block'}}\u003eLoad More\u003c/span\u003e}\n    noMore={\u003cdiv className=\"loader\"\u003eNo More Items\u003c/div\u003e} \n    loadNext={this.loadNextFunc}\u003e\n    {items}\n\u003c/LimitedInfiniteScroll\u003e\n```\n\n## Props\n\n| Name             | Type          | Default    | Description|\n|:----             |:----          |:----       |:----|\n| `limit`          | `Number`      | `10`       | 分页达到该数量后不再自动滚动加载|\n| `pageStart`      | `Number`      | `0`        | 起始分页|\n| `threshold`      | `Number`      | `200`      | 列表底部距离窗口距离少于该临界值时触发`loadNext`|\n| `hasMore`        | `Boolean`     | `false`    | 是否有更多分页可以加载|\n| `autoLoad`       | `Boolean`     | `true`     | 是否组件初始化时就直接加载第一页内容(pageStart应该设为0)|\n| `useWindow`      | `Boolean`     | `true`     | 事件监听是否附件至`window`, 否则附加至组件的`parentNode`|\n| `loadNext`       | `Function`    |            | 加载下一页的回调方法|\n| `spinLoader`     | `Element`     |            | 自动加载指示器元素|\n| `mannualLoader`  | `Element`     |            | 手动加载指示器元素|\n| `noMore`         | `Element`     | `null`     | 没有更多分页时的指示器元素|\n\n## 其它\n\n使用React 15.5+的用户，由于PropTypes已经从React主库分离，请安装2.x.x版本\n```\nnpm install react-limited-infinite-scroll --save-dev\n```\n\n而使用较老版本React的用户，安装1.x.x版本\n```\nnpm install react-limited-infinite-scroll@~1.0.0 --save-dev\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthundernet8%2Freact-limited-infinite-scroll","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthundernet8%2Freact-limited-infinite-scroll","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthundernet8%2Freact-limited-infinite-scroll/lists"}