初始化后会在 page 的 this 上注入$router 变量。
config：IRouterConfig
export interface IRouterConfig { routes?: IRoute[]; option?: { namespace?: string; //注入到this上的变量名，默认$router initPath?: string; //最开始的path }; } export interface IRoute { path: string; component: string; //组件名 children?: IRoute[]; }
Page({ onLoad() { routerInit.call(this, routerConfig); //需注入this }, });
动态的导航到一个新 URL。
_注：此 url 非真实 url，仅供单页面方案使用_
path: string
Page({ onLoad() { routerInit.call(this, routerConfig); }, onItemClick(event) { let { type, component } = event.target.dataset; console.log(`/${type}/${component}`); this.$router.push(`/${type}/${component}`); }, onReplace(event) { let { type, component } = event.target.dataset; console.log(`/${type}/${component}`); this.$router.replace(`/${type}/${component}`); }, });
这个方法的参数是一个整数，意思是在 history 记录中向前或者后退多少步，类似 window.history.go(n)。
// 在记录中前进一步 router.go(1); // 后退一步记录 router.go(-1); // 前进 3 步记录 router.go(3); // 如果记录不够用，调用失败 router.go(-100); router.go(100);
设置钩子函数，此函数会在导航变更前调用，若返回的值不为 true，则导航不会变化。
1）this: IComponent | null；
2）methodName: string。
注：
1）this 为页面 this 或自定义组件 this，当this 为 null 时，删除之前设置的钩子函数_；
2）页面中只能设置一次，重复设置会覆盖之前的钩子函数。
Page({ onLoad() { routerInit.call(this, routerConfig); this.$router.setBeforeChange(this, "onBeforeChange"); }, onBeforeChange(from, to) { //钩子函数可以获取两个参数，from为当前路由，to为即将要跳转的路由 console.log(from, to); return true; }, onUnload() { this.$router.setBeforeChange(null); }, });
设置钩子函数，此函数会在导航变更后调用。
1）this: IComponent | null；
2）methodName: string。
注：
1）this 为页面 this 或自定义组件 this，当this 为 null 时，删除之前设置的钩子函数_；
2）页面中只能设置一次，重复设置会覆盖之前的钩子函数。
Page({ onLoad() { routerInit.call(this, routerConfig); this.$router.setAfterChange(this, 'onAfterChange'); }, onAfterChange(){ //逻辑 } onUnload(){ this.$router.setAfterChange(null) } });
设置钩子函数，此函数会在 params 变化时被调用。
1）this: IComponent；
2）methodName: string。
注：
1）this 为页面 this 或自定义组件 this_；
2）页面中可设置多次（如多个自定义组件中），但同一 this 作用域中，重复设置会覆盖此作用域之前设置的钩子函数，
Page({ onLoad() { routerInit.call(this, routerConfig); this.$router.addParamsListener(this, "onParamsChange"); }, onParamsChange(preParams, nextParams) { //钩子函数可以获取两个参数，preParams为之前的params， //nextParams为变化后的params console.log(preParams, nextParams); }, });
删除某个 this 作用域中设置的钩子函数。
this: IComponent
注：this 为页面 this 或自定义组件 this_。
Component({ mixins: [], data: { params: {} }, props: { query: {}, }, didMount() { let $router = this.$page.$router; $router.addParamsListener(this, "onParamsChange"); }, didUpdate() {}, didUnmount() { this.$page.$router.removeParamsListener(this); }, methods: { onParamsChange(preParams, nextParams) { this.setData({ params: nextParams }); }, }, });
