{"_id":"@aotoo/react-pager","_rev":"4-af315e9d3f9b45075a186b9c9fed3be6","name":"@aotoo/react-pager","dist-tags":{"latest":"1.0.2","alpha":"1.0.0-alpha.0"},"versions":{"1.0.0":{"name":"@aotoo/react-pager","version":"1.0.0","description":"base on react/aotoo, it's router component","scripts":{"build":"babel src -d dest","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/webkixi/aotoo-react-pager.git"},"main":"dest/index.js","dependencies":{"@aotoo/aotoo":"^6.1.35"},"devDependencies":{"@babel/cli":"^7.11.6","@babel/core":"^7.11.1","@babel/plugin-proposal-class-properties":"^7.10.4","@babel/plugin-proposal-decorators":"^7.10.5","@babel/plugin-proposal-export-default-from":"^7.10.4","@babel/plugin-proposal-export-namespace-from":"^7.10.4","@babel/plugin-proposal-function-bind":"^7.10.5","@babel/plugin-proposal-function-sent":"^7.10.4","@babel/plugin-syntax-dynamic-import":"^7.8.3","@babel/plugin-transform-computed-properties":"^7.10.4","@babel/plugin-transform-runtime":"^7.11.0","@babel/polyfill":"^7.10.4","@babel/preset-env":"^7.9.5","core-js":"^3.6.5","@babel/preset-react":"^7.10.4","del":"^5.1.0","gulp":"^4.0.2","gulp-babel":"^8.0.0","gulp-uglify":"^3.0.2"},"keywords":["aotoo","react","frontend","componet","components","router","react-component","ui"],"browserslist":["last 2 versions","Firefox ESR","> 1%","ie >= 11","maintained node versions"],"author":{"name":"天天修改"},"license":"MIT","homepage":"http://www.agzgz.com","bugs":{"url":"https://github.com/webkixi/aotoo-react-pager/issues"},"gitHead":"f3ab7c1cc9f14fa371a7792069c5d66591e4085d","_id":"@aotoo/react-pager@1.0.0","_nodeVersion":"14.15.1","_npmVersion":"6.14.9","dist":{"integrity":"sha512-s0nAv4zFCbyfsM/8LB8bHaVFoYQNKY82Iug+92jhGu/6dRZ8AnzIyaLI0wiRe78LamF4oup+qXIYDzGpBupi5Q==","shasum":"35128a68aca1ace698117fe230021f6c6780aa06","tarball":"https://registry.npmjs.org/@aotoo/react-pager/-/react-pager-1.0.0.tgz","fileCount":24,"unpackedSize":105094,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf8LeWCRA9TVsSAnZWagAAQPwP/1PXGBpghtWUGBro/fiY\nNaPr1WgIkYnwgBjytdpH0fuhjTREWGhBAMBAbRsHqvAikxhJsvTB56xS9Mrj\nTTx7e5wZkFsnzwIHg5tVyhABl7SJRXSYU2nKEhEbYnb5ns2grwMmNLbdgxQs\nKgUEP13QfGK1XUhyYq4vY0fxjwkaD7okvdYycDRozbfQsQk4VcqmSduxSKVy\nuqtoxwzB5BuKrtL2mi3h+wVicInfEOjAWxOuNpgD2XsA84juhQM5lf4HHM91\nNc+HVNJl0ZaZn7VY3KFPkzins+8NpJHuj3GlZKWV5ZVwHlaYzwjPet2ciLTQ\nH6QKfBw01mPwhbULAyxnlIJHNhkA74ztKw4WEJfxs7CMmyLNdtP5ZtQeHlyl\nJmyjEeGa1t5u9hS1Ni2toHq37O5saI7y7KLvF4gashKDjNDY/XKSr3NUMh+3\nPEwbCosyzi+4kDwb7Z+x9m/fjRgCC5rgREuWGMEJv0aSDFXGdvrO+5tHF7UG\ntQlYbsUPIj9kZ+UXxDEFLqV75HKe3PvTzlG5RDlN9NPfAedRGwUZ6aeMacEG\n24fA9+0kCEwim1T0tVWQ4XZCi0jVf7MEvbggY4o1ol/7CAIc/0GCbD8AXSC4\nJn8UnzJeB9mv8wVFkV4Yc2kVbu5F8J7nygHg0Mf9eunYh3TQ8yaif/vc1y/P\nHWy5\r\n=hyNO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCrNMYNuPqk2aUtX/mBi9oaGOUvJP7MaGNIA9WhJZDmUAIhAOcJSRiMjjIxh9bDNim5YRsonmbutWwPgNYBJgBzPn2V"}]},"_npmUser":{"name":"webkixi","email":"kixi@163.com"},"directories":{},"maintainers":[{"name":"webkixi","email":"kixi@163.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-pager_1.0.0_1609611157445_0.5956526779779874"},"_hasShrinkwrap":false},"1.0.0-alpha.0":{"name":"@aotoo/react-pager","version":"1.0.0-alpha.0","description":"base on react/aotoo, it's router component","scripts":{"build":"babel src -d dest","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/webkixi/aotoo-react-pager.git"},"main":"dest/index.js","dependencies":{},"devDependencies":{"@babel/cli":"^7.11.6","@babel/core":"^7.11.1","@babel/plugin-proposal-class-properties":"^7.10.4","@babel/plugin-proposal-decorators":"^7.10.5","@babel/plugin-proposal-export-default-from":"^7.10.4","@babel/plugin-proposal-export-namespace-from":"^7.10.4","@babel/plugin-proposal-function-bind":"^7.10.5","@babel/plugin-proposal-function-sent":"^7.10.4","@babel/plugin-syntax-dynamic-import":"^7.8.3","@babel/plugin-transform-computed-properties":"^7.10.4","@babel/plugin-transform-runtime":"^7.11.0","@babel/polyfill":"^7.10.4","@babel/preset-env":"^7.9.5","@babel/preset-react":"^7.10.4","core-js":"^3.6.5","del":"^5.1.0","gulp":"^4.0.2","gulp-babel":"^8.0.0","gulp-uglify":"^3.0.2"},"keywords":["aotoo","react","frontend","componet","components","router","react-component","ui"],"browserslist":["last 2 versions","Firefox ESR","> 1%","ie >= 11","maintained node versions"],"author":{"name":"天天修改"},"license":"MIT","homepage":"http://www.agzgz.com","bugs":{"url":"https://github.com/webkixi/aotoo-react-pager/issues"},"readme":"# @aotoo/react-pager\n\n基于react的一款前端路由(仿小程序)，支持node端渲染，在`aotoo-hub`中可以查看该路由使用方法，[**戳这里**](http://www.agzgz.com)\n\n## 安装 \n\n```bash\nnpm install @aotoo/react-pager\n# 或者\nyarn add @aotoo/react-pager\n```\n\n## Pager方法\n\n我们使用`Pager`来构建单页面，仿小程序页面生命周期\n\n```js\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport Pager from '@aotoo/react-pager'\n\nfunction template(state, props) {\n return
{state.file}
\n}\n\nconst page = Pager({\n // page的模板方法\n template,\n\n // 可以通过setData方法修改此处参数\n data: {\n file: 'readme.md',\n },\n\n // 页面开始的方法\n // 接收上一个页面传递的数据\n onLoad(param){\n let file = param.file\n let $file = this.getData().file\n if (file && file !== $file) {\n this.setData({ file })\n }\n },\n\n // 页面显示时调用\n // 每个页面都会调用onLoad和onShow方法，\n // 当使用navigateTo方法跳转页面时, back回来此页面时会调用onShow的方法\n onShow(){},\n\n // 页面卸载时\n onUnload(){},\n\n // 页面dom元素全部加载完成时\n onReady(){}\n})\n\nReactDOM.render(, document.getElementById('root'))\n\n```\n\n## Pager.pages\n\n该方法用于定义路由表，构建SPA项目。支持node端渲染。默认会自动渲染结构到 `#root` 容器\n\n### 语法\n\n```js\nPager.pages([\n item,\n item,\n ...\n], options)\n```\n\n### items\n\n路由表数组\n\n`item.url` \n{String} \n路由地址，该条路由的ID，必须指定唯一值，地址栏的hash部分将显示该值\n\n`item.content` \n{Function} \n指定路由子页内容，支持全量引入(require)，支持按需引入(import) \n\n### options\n\n`options.root` \n{String} \n默认为`root`，指定路由容器\n\n`options.sep` \n{String} \n默认为`#`，置为空则转为内存路由\n\n`options.maxAge` \n{String} \n路由历史记录的缓存事件，使用saveHistory方法时调用 \n\n`options.header` \n{[JSX|Function]} \n配置路由页面的头部，支持JSX，或者item组件配置 \n\n`options.footer` \n{[JSX|Function]} \n配置路由页面的底部，支持JSX，或者item组件配置 \n\n`options.menus` \n{[JSX|Function]} \n配置路由页面的菜单部分，支持JSX \n\n`options.select` \n{[String]} \n默认菜单项，默认显示页面，填写路由子线配置的`url`属性，该属性支持query方式传递参数给进入页面，不填写则默认第一条路由数据作为首页\n\n`options.beforeNav` \n{Function} \n全局路由守卫，手动拦截/放行所有路由 \n\n`options.goback` \n{Function} \n全局路由守卫，返回后执行该回调\n\n`options.unLoad` \n{Function} \n路由卸载时，触发此方法\n\n### 定义SPA路由表示例\n\n**路由表**\n\n```js\n// index.js\n\nimport Pager from '@aotoo/react-pager'\nconst nav = Pager.nav\n\n// 构建SPA路由，并自动渲染至#root容器(默认)\nexport default Pager.pages([\n {url: '/index/a', content: import('./_subpages/a')},\n {url: '/index/b', content: import('./_subpages/b')},\n {url: '/index/c', content: require('./_subpages/c')},\n], {\n select: '/index/a',\n})\n```\n\n**子页面** \n\n```js\n// ./_subpages/a.js\n\nfunction template(state, props) {\n return (\n \n {state.title}\n \n )\n}\n\nexport default function(Pager) {\n return Pager({\n template,\n\n data: {\n title: '这是a页面'\n },\n \n onLoad(param){ // param为页面传递参数\n // 页面加载时\n },\n\n onUnload(){\n // 页面卸载时\n },\n\n onReady(){\n // 页面dom已被渲染完成时\n this.setData({\n title: '为a页面设置新的内容'\n })\n }\n })\n}\n```\n\n**server**\n\n```js\nimport index from '../index'\nconst htmlStr = await index\n```\n\n## Pager.nav\n\n`Pager.nav`是一个对象，包含下面路由方法，路由方法的设计参考自小程序\n\n- navigateTo\n- navigateBack\n- redirectTo\n- redirectBack\n- reLaunch\n\n```js\nconst nav = Pager.nav\n\nnav.navigateTo(...)\nnav.relaunch(...)\n...\n```\n\n### reLaunch\n\n关闭所有页面，打开到应用内的某个页面 \n\n使用\n\n```js\nnav.reLaunch({\n url: '',\n success: function(){}\n ...\n})\n```\n\n| 属性 | 类型 | 默认值 | 必填 | 说明 |\n| :----: | :----: | :----: | :----: | :---- |\n| url | string | | 是 | 跳转的应用内页面路径 |\n| beforeNav | function | | 否 | 跳转前动作 |\n| success | function | | 否 | 跳转成功执行 |\n| fail | function | | 否 | 跳转失败执行 |\n| complete | function | | 否 | 跳转执行(成功&失败) |\n| events | object | | 否 | 未实现 |\n\n#### url\n\n需要跳转的应用内页面的路径 (代码包路径), 路径后可以带参数。参数与路径之间使用 ? 分隔，参数键与参数值用 = 相连，不同参数用 & 分隔；如 'path?key=value&key2=value2'\n\n#### beforeNav(to, from, next)\n\n跳转前方法，该方法可阻止跳转\n`to` \n{Object} \n将要跳转的目的页面的配置 \n\n`from` \n{Object} \n当前页面的配置 \n\n`next` \n{Function} \n`next(param)`: 执行该方法允许路由跳转，param将被合并到to的参数中，允许修改将要跳转页面页面参数 \n\n```js\nonClick(e, param, inst){\n nav.redirectTo({\n url: '/index/a?file=' + file,\n beforeNav(to, from, next) {\n if (满足条件) {\n next()\n }\n }\n })\n}\n```\n\n### navigateTo \n\n保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层\n\n配置参考 reLaunch\n\n### navigateBack\n\n关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈，决定需要返回几层。 \n\n配置参考 reLaunch\n\n### redirectTo\n\n关闭当前页面，跳转到应用内的某个页面。 \n\n配置参考 reLaunch\n\n### redirectBack\n\n关闭当前页面，返回上一页面 \n\n配置参考 reLaunch\n\n## 路由实例\n\nPager是路由的封装方法，支持嵌套路由，每一次路由初始化将会产生一个新的路由实例，使用nav对象做路由跳转时，nav对象会自动匹配路有实例并实现路由跳转。\n\n但有一些特殊点的实例方法需要手动操作 \n\n### 获取路由实例\n\n```js\nlet router = Pager.getRouter() // 获取当前操作的路由实例 \nlet rootRouter = Pager.getRootRouter() // 获取祖先路由实例 \n```\n\n### 路由实例方法 \n\n**router.getCurrentPages** \n获取当前路由的参数信息 \n\n**router.saveHistory** \n保存路由的历史数据到localstorage，通常这个操作只针对rootRouter\n\n**router.clearHistory** \n清空路由的历史记录，当我们使用`reLaunch`路由方法时会自动调用，通常这个操作只针对rootRouter\n\n**router.restoreHistory** \n由localstorage恢复路由的历史记录，通常这个操作只针对rootRouter\n","readmeFilename":"README.md","gitHead":"f3ab7c1cc9f14fa371a7792069c5d66591e4085d","_id":"@aotoo/react-pager@1.0.0-alpha.0","_nodeVersion":"14.15.1","_npmVersion":"6.14.9","dist":{"integrity":"sha512-L18auNuaJBL2+NsrJoSWwPjxDlL4mMcbVub8lSniTqoEXJD+4jW16lzjQhXsHS/8qUiZMm9YVkyB9u9ovMXdWg==","shasum":"f195f869d1185aa007761c21925dd499edaa559c","tarball":"https://registry.npmjs.org/@aotoo/react-pager/-/react-pager-1.0.0-alpha.0.tgz","fileCount":24,"unpackedSize":105069,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf9RsZCRA9TVsSAnZWagAAZccP/jVBoV/J2l6YyyWmwDmD\nQH3ACBJFIXFQIoIpmc1mylRUlp+6ONdz7OL54zKTIZzVuT6XRoQlr/knZsrG\nFEMjcUsp+AjSe60q6NUEP/Jcl5VAGOavhZ9hAVhZWGZhM/1O/PAPyRUqCpXO\nKbqTXDxQPbdlS0Fk4f7yhJqLN8IC4oGRWea36xjH1gcpVwihKpgmnZmBKH2k\nFqbflpzAwYLwjfw8tvTFGS5EZhqpdAA1AjjIyWsIh9Etjk3ClQGOcMxFEXSH\nxw+CebfghccNu9SoiTDcGeG/2v9DZfJWEa0F3xqCokG5acO4cEjnk5oFmcd1\nvRQ7w253L0LXgdM05DsUfl/BX/ZhBLDXce/oteoSbq24TDLOjaE7jZRibuIX\nqrPn8YQMT/xkkgaG875iHmTGym0eBoxRSua+nY8Bb/igDGpMwOn4XnhXRGCB\nAhfhAocU/zlJPpVMkOp9LCWeXh9lXmsOA6EkjMOAu4eFHJszjeCOItLtqdEk\nyRuVJ0GYk/8VIcQePIH+pNzACFpxrs+Ij2COdwCo+6qoUEubS/WE4NiKvlRl\nugvc1wioSK9MrF69FA4i25TDjNkjxS2BR6x+aOYeeAQ55cMzz0uOMTF/Eue8\nf9iscYJpFlVXidATvLmjaGUSpoVKGia6AcNhqitNRf5SEjrfiV3oQNt5ShTV\nQ/cr\r\n=NgH+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCzONhb+uhLcvGxER7NrHjKmL3q6lQ8WYYb7Qm807eXHQIgfTxtd5L52cmBIZr0V9sL85HWYqrXAAbkRuxAgnIXKEc="}]},"_npmUser":{"name":"webkixi","email":"kixi@163.com"},"directories":{},"maintainers":[{"name":"webkixi","email":"kixi@163.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-pager_1.0.0-alpha.0_1609898776723_0.17948599827009648"},"_hasShrinkwrap":false},"1.0.1":{"name":"@aotoo/react-pager","version":"1.0.1","description":"base on react/aotoo, it's router component","scripts":{"build":"babel src -d dest","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/webkixi/aotoo-react-pager.git"},"main":"dest/index.js","dependencies":{},"devDependencies":{"@babel/cli":"^7.11.6","@babel/core":"^7.11.1","@babel/plugin-proposal-class-properties":"^7.10.4","@babel/plugin-proposal-decorators":"^7.10.5","@babel/plugin-proposal-export-default-from":"^7.10.4","@babel/plugin-proposal-export-namespace-from":"^7.10.4","@babel/plugin-proposal-function-bind":"^7.10.5","@babel/plugin-proposal-function-sent":"^7.10.4","@babel/plugin-syntax-dynamic-import":"^7.8.3","@babel/plugin-transform-computed-properties":"^7.10.4","@babel/plugin-transform-runtime":"^7.11.0","@babel/polyfill":"^7.10.4","@babel/preset-env":"^7.9.5","@babel/preset-react":"^7.10.4","core-js":"^3.6.5","del":"^5.1.0","gulp":"^4.0.2","gulp-babel":"^8.0.0","gulp-uglify":"^3.0.2"},"keywords":["aotoo","react","frontend","componet","components","router","react-component","ui"],"browserslist":["last 2 versions","Firefox ESR","> 1%","ie >= 11","maintained node versions"],"author":{"name":"天天修改"},"license":"MIT","homepage":"http://www.agzgz.com","bugs":{"url":"https://github.com/webkixi/aotoo-react-pager/issues"},"gitHead":"f3ab7c1cc9f14fa371a7792069c5d66591e4085d","_id":"@aotoo/react-pager@1.0.1","_nodeVersion":"14.15.1","_npmVersion":"6.14.9","dist":{"integrity":"sha512-DpweUqKDOmrQnXur6nmjBVgT1rtXx1t6RCvozNq1Wh0x6en4N9f573OdV/2OJdhlxjCxzZJycJJR3L/2O9TqlQ==","shasum":"e2c783477f28c5a7415dd17babc8b77ab5367b24","tarball":"https://registry.npmjs.org/@aotoo/react-pager/-/react-pager-1.0.1.tgz","fileCount":24,"unpackedSize":105061,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf9TM4CRA9TVsSAnZWagAA8gIP/A7TTzAEbaqs/iUQs1ta\nyJK698DFMYnHOp7/m/QaQVHuJ3n0J3oYnavsMDASBRrfTsHmstFrgXQKqOXd\nMQM2KY8Q8jch1l5C1TWSiYn7mc1OPz7FAdy//SeSOW7RznJOGfc6r4op9yew\ntvD9MTlR4Iu7fR7Z9n1OEUXDbEWFBUvNMs8/2Y2YDQwfcXsuqFR2P4YVWGr/\nbOMNKcWEtapbYfAQ+ll9/mcW6ZTGOQEUqJIPKDf6ZQzweOyuGbOa2YwZ85Tr\nVTf0AfqDmrY1IZxHATDoT2q7VzTsi04DRtBBFfEMgjRkDg34KrGeVrz1cFJq\ncAV2LOYjBjB964+5awxgHveEZaqOJMZuCvRrhStHyhbktZDvnC08TP6FL2wF\nFtnJHuJS+c/EKB7TZOKyRm6Iq1vxKGLrlEKQi/UPZFnHnGlbFGhVwpvNAh9b\nwcmjqA+x2KD6tqU5VHa/s/NbGYSRvLN+OfUvEtQH3lU3am7tC/v6XPfU6Uap\n2/PCQmLaMg/gk5x2lzogOgjMBwi+CHaErHdMMJFZJ0oFmdKalH2ldnKvimgL\nKqAAuHwBmq9a+ZNMskvwkd+ghgTiG2tyO/DuyWf4juvkFPp/KrNQCXfUQZX2\nY/84FNMfz3zHsHafvKFKzn9U06mk10MzBSSmLeRaAVeho0K9kOxaOQ9FF5zX\nLvDu\r\n=QNBk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD53kE3N0Ur7G0aETEItt/XMo/bwXqc0YLkGWaL5G0yiwIhAM82zdvNaZWc+ycZ/aomiXfAQc10uUPweo4MWXICajnJ"}]},"_npmUser":{"name":"webkixi","email":"kixi@163.com"},"directories":{},"maintainers":[{"name":"webkixi","email":"kixi@163.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-pager_1.0.1_1609904951648_0.7924452119077945"},"_hasShrinkwrap":false},"1.0.2":{"name":"@aotoo/react-pager","version":"1.0.2","description":"base on react/aotoo, it's router component","scripts":{"build":"babel src -d dest","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/webkixi/aotoo-react-pager.git"},"main":"dest/index.js","dependencies":{},"devDependencies":{"@babel/cli":"^7.11.6","@babel/core":"^7.11.1","@babel/plugin-proposal-class-properties":"^7.10.4","@babel/plugin-proposal-decorators":"^7.10.5","@babel/plugin-proposal-export-default-from":"^7.10.4","@babel/plugin-proposal-export-namespace-from":"^7.10.4","@babel/plugin-proposal-function-bind":"^7.10.5","@babel/plugin-proposal-function-sent":"^7.10.4","@babel/plugin-syntax-dynamic-import":"^7.8.3","@babel/plugin-transform-computed-properties":"^7.10.4","@babel/plugin-transform-runtime":"^7.11.0","@babel/polyfill":"^7.10.4","@babel/preset-env":"^7.9.5","@babel/preset-react":"^7.10.4","core-js":"^3.6.5","del":"^5.1.0","gulp":"^4.0.2","gulp-babel":"^8.0.0","gulp-uglify":"^3.0.2"},"keywords":["aotoo","react","frontend","componet","components","router","react-component","ui"],"browserslist":["last 2 versions","Firefox ESR","> 1%","ie >= 11","maintained node versions"],"author":{"name":"天天修改"},"license":"MIT","homepage":"http://www.agzgz.com","bugs":{"url":"https://github.com/webkixi/aotoo-react-pager/issues"},"gitHead":"205dc77501d53177a779e9438317e860ca01bed3","_id":"@aotoo/react-pager@1.0.2","_nodeVersion":"14.16.0","_npmVersion":"7.6.0","dist":{"integrity":"sha512-Iwxt+IHggzEsdW78J7PQwhOrnUCnxHqxi5UtKi/Gg3K7CQWdpCVIQHOABFYPs299Pf74BkwkGrHnbpV5eNVFHg==","shasum":"15151a1dee6163453161cafedd2b260e62e78c6a","tarball":"https://registry.npmjs.org/@aotoo/react-pager/-/react-pager-1.0.2.tgz","fileCount":24,"unpackedSize":107605,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgflfRCRA9TVsSAnZWagAAfkwP+wfDfbR89fq/L/wVR1Fr\n2Orf//q1PyDE8geZBWRq2K2jXBmsrcIrSI+tsVjPEmS6TqiL4KyDjHLnyj2t\n5QiqIghNwxDAvvd3Y+VXaVoMPLm/TQuXOUl80VjIfhIhO6pkxTVLBWW9LQ/l\navQCkwOVlobTOe24kion4TcGsSPLtN/gh6iv0voKuOoW09wAM0ZPBMzJfkXg\nT5xOrLiy0j+CxXmuWLhzyKBKljKooH+XBlGhzw2bgRG7UW+Pd0u8sRQqY5j/\nCQRq1azbY30+cmeuncB2Trg9hmcpo6qwSE8EdJbbJZtiQWNMPRrHEqE3aUSx\n3dxxuuXLH9N2QqwMSKvXAEFlNdIyiyHBpsOoCHMwVBKgjydOg9sFD6LGBdsB\nYvc1kkWVs/9dxQ8Wufg6wHAyh6pVqS5bHAE+jXIH1V2I7/stWA8gg3sspNGg\nrVSNYcCSDv+KfZYHEDLdglmjOfnFqteLjrcIIQnJYbOpIb13Y2XLWSuZN/l9\nz8yjgVATn+j0UXTtx1nCqgIZnrarusDt1hQm8ez6fPw4OH7m1YfsbEIDPsy0\nOnJHzEUUCA8BsSVaSwYTb7uz0UVDKhyX1twmxNJmEN0LHyQIOtxe8ZmW10O1\nIytny5J3t0ZSEi5kQq+eya9SssisM89NTTA6DSH+vipsiGAJcvDTKz2jScTL\nKNsM\r\n=lZeI\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCna4spFQtAlNcKTo4yH+0g3lYASqc/pH5SDOut1lGElwIgEyrZbVQTBnYTIa0kih472pKffasSfMi84jZve8u9a/Y="}]},"_npmUser":{"name":"webkixi","email":"kixi@163.com"},"directories":{},"maintainers":[{"name":"webkixi","email":"kixi@163.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-pager_1.0.2_1618892753309_0.7522549186544283"},"_hasShrinkwrap":false}},"time":{"created":"2021-01-02T18:12:37.362Z","1.0.0":"2021-01-02T18:12:37.631Z","modified":"2022-04-04T14:30:26.729Z","1.0.0-alpha.0":"2021-01-06T02:06:16.883Z","1.0.1":"2021-01-06T03:49:11.853Z","1.0.2":"2021-04-20T04:25:53.429Z"},"maintainers":[{"name":"webkixi","email":"kixi@163.com"}],"description":"base on react/aotoo, it's router component","homepage":"http://www.agzgz.com","keywords":["aotoo","react","frontend","componet","components","router","react-component","ui"],"repository":{"type":"git","url":"git+https://github.com/webkixi/aotoo-react-pager.git"},"author":{"name":"天天修改"},"bugs":{"url":"https://github.com/webkixi/aotoo-react-pager/issues"},"license":"MIT","readme":"# @aotoo/react-pager\n\n基于react的一款前端路由(仿小程序)，支持node端渲染，在`aotoo-hub`中可以查看该路由使用方法，[**戳这里**](http://www.agzgz.com)\n\n## 安装 \n\n```bash\nnpm install @aotoo/react-pager\n# 或者\nyarn add @aotoo/react-pager\n```\n\n## Pager方法\n\n我们使用`Pager`来构建单页面，仿小程序页面生命周期\n\n```js\nimport React from 'react'\nimport ReactDOM from 'react-dom'\nimport Pager from '@aotoo/react-pager'\n\nfunction template(state, props) {\n return
{state.file}
\n}\n\nconst page = Pager({\n // page的模板方法\n template,\n\n // 可以通过setData方法修改此处参数\n data: {\n file: 'readme.md',\n },\n\n // 页面开始的方法\n // 接收上一个页面传递的数据\n onLoad(param){\n let file = param.file\n let $file = this.getData().file\n if (file && file !== $file) {\n this.setData({ file })\n }\n },\n\n // 页面显示时调用\n // 每个页面都会调用onLoad和onShow方法，\n // 当使用navigateTo方法跳转页面时, back回来此页面时会调用onShow的方法\n onShow(){},\n\n // 页面卸载时\n onUnload(){},\n\n // 页面dom元素全部加载完成时\n onReady(){}\n})\n\nReactDOM.render(, document.getElementById('root'))\n\n```\n\n## Pager.pages\n\n该方法用于定义路由表，构建SPA项目。支持node端渲染。默认会自动渲染结构到 `#root` 容器\n\n### 语法\n\n```js\nPager.pages([\n item,\n item,\n ...\n], options)\n```\n\n### items\n\n路由表数组\n\n`item.url` \n{String} \n路由地址，该条路由的ID，必须指定唯一值，地址栏的hash部分将显示该值\n\n`item.content` \n{Function} \n指定路由子页内容，支持全量引入(require)，支持按需引入(import) \n\n### options\n\n`options.root` \n{String} \n默认为`root`，指定路由容器\n\n`options.sep` \n{String} \n默认为`#`，置为空则转为内存路由\n\n`options.maxAge` \n{String} \n路由历史记录的缓存事件，使用saveHistory方法时调用 \n\n`options.header` \n{[JSX|Function]} \n配置路由页面的头部，支持JSX，或者item组件配置 \n\n`options.footer` \n{[JSX|Function]} \n配置路由页面的底部，支持JSX，或者item组件配置 \n\n`options.menus` \n{[JSX|Function]} \n配置路由页面的菜单部分，支持JSX \n\n`options.select` \n{[String]} \n默认菜单项，默认显示页面，填写路由子线配置的`url`属性，该属性支持query方式传递参数给进入页面，不填写则默认第一条路由数据作为首页\n\n`options.beforeNav` \n{Function} \n全局路由守卫，手动拦截/放行所有路由 \n\n`options.goback` \n{Function} \n全局路由守卫，返回后执行该回调\n\n`options.unLoad` \n{Function} \n路由卸载时，触发此方法\n\n### 定义SPA路由表示例\n\n**路由表**\n\n```js\n// index.js\n\nimport Pager from '@aotoo/react-pager'\nconst nav = Pager.nav\n\n// 构建SPA路由，并自动渲染至#root容器(默认)\nexport default Pager.pages([\n {url: '/index/a', content: import('./_subpages/a')},\n {url: '/index/b', content: import('./_subpages/b')},\n {url: '/index/c', content: require('./_subpages/c')},\n], {\n select: '/index/a',\n})\n```\n\n**子页面** \n\n```js\n// ./_subpages/a.js\n\nfunction template(state, props) {\n return (\n \n {state.title}\n \n )\n}\n\nexport default function(Pager) {\n return Pager({\n template,\n\n data: {\n title: '这是a页面'\n },\n \n onLoad(param){ // param为页面传递参数\n // 页面加载时\n },\n\n onUnload(){\n // 页面卸载时\n },\n\n onReady(){\n // 页面dom已被渲染完成时\n this.setData({\n title: '为a页面设置新的内容'\n })\n }\n })\n}\n```\n\n**server**\n\n```js\nimport index from '../index'\nconst htmlStr = await index\n```\n\n## Pager.nav\n\n`Pager.nav`是一个对象，包含下面路由方法，路由方法的设计参考自小程序\n\n- navigateTo\n- navigateBack\n- redirectTo\n- redirectBack\n- reLaunch\n\n```js\nconst nav = Pager.nav\n\nnav.navigateTo(...)\nnav.relaunch(...)\n...\n```\n\n### reLaunch\n\n关闭所有页面，打开到应用内的某个页面 \n\n使用\n\n```js\nnav.reLaunch({\n url: '',\n success: function(){}\n ...\n})\n```\n\n| 属性 | 类型 | 默认值 | 必填 | 说明 |\n| :----: | :----: | :----: | :----: | :---- |\n| url | string | | 是 | 跳转的应用内页面路径 |\n| beforeNav | function | | 否 | 跳转前动作 |\n| success | function | | 否 | 跳转成功执行 |\n| fail | function | | 否 | 跳转失败执行 |\n| complete | function | | 否 | 跳转执行(成功&失败) |\n| events | object | | 否 | 未实现 |\n\n#### url\n\n需要跳转的应用内页面的路径 (代码包路径), 路径后可以带参数。参数与路径之间使用 ? 分隔，参数键与参数值用 = 相连，不同参数用 & 分隔；如 'path?key=value&key2=value2'\n\n#### beforeNav(to, from, next)\n\n跳转前方法，该方法可阻止跳转\n`to` \n{Object} \n将要跳转的目的页面的配置 \n\n`from` \n{Object} \n当前页面的配置 \n\n`next` \n{Function} \n`next(param)`: 执行该方法允许路由跳转，param将被合并到to的参数中，允许修改将要跳转页面页面参数 \n\n```js\nonClick(e, param, inst){\n nav.redirectTo({\n url: '/index/a?file=' + file,\n beforeNav(to, from, next) {\n if (满足条件) {\n next()\n }\n }\n })\n}\n```\n\n### navigateTo \n\n保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层\n\n配置参考 reLaunch\n\n### navigateBack\n\n关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈，决定需要返回几层。 \n\n配置参考 reLaunch\n\n### redirectTo\n\n关闭当前页面，跳转到应用内的某个页面。 \n\n配置参考 reLaunch\n\n### redirectBack\n\n关闭当前页面，返回上一页面 \n\n配置参考 reLaunch\n\n## 路由实例\n\nPager是路由的封装方法，支持嵌套路由，每一次路由初始化将会产生一个新的路由实例，使用nav对象做路由跳转时，nav对象会自动匹配路有实例并实现路由跳转。\n\n但有一些特殊点的实例方法需要手动操作 \n\n### 获取路由实例\n\n```js\nlet router = Pager.getRouter() // 获取当前操作的路由实例 \nlet rootRouter = Pager.getRootRouter() // 获取祖先路由实例 \n```\n\n### 路由实例方法 \n\n**router.getCurrentPages** \n获取当前路由的参数信息 \n\n**router.saveHistory** \n保存路由的历史数据到localstorage，通常这个操作只针对rootRouter\n\n**router.clearHistory** \n清空路由的历史记录，当我们使用`reLaunch`路由方法时会自动调用，通常这个操作只针对rootRouter\n\n**router.restoreHistory** \n由localstorage恢复路由的历史记录，通常这个操作只针对rootRouter\n","readmeFilename":"README.md"}