Novae

虚拟路由

配置项

  您需要从Novae.router方法传入以下形式的配置项。

name

  路由内置名称，可通过从框架入口导入的goTo方法转到。

  • 类型

    string

url

  在地址栏匹配的路径，支持自定义参数列表及正则表达式定义。

  • 类型

    string | RegExp

  • 自定义参数列表

    以/分割，由:开头的项可被识别为参数项。 以/courses/:courseID/:SNo/score举例，中间的:courseID与:sNo可替换为任何符合规范的值，识别后会作为参数将courseID与sNo传入对应component中，并可以通过this.params.参数名调用。

  • 正则表达式

    该种方式会在所有自定义参数列表与普通方式下未搜索到路由时触发，优先度较低。

component

  转到路由时渲染的组件。

  • 类型

    CustomComponent

getParams

  自定义从地址栏路径获取参数的方法。

  • 类型

    Function

  • 参数列表

    1. url (string): 地址栏路径

  • 返回值

    (Object): 属性名为参数名，属性值为参数值

  • 备注

    1. 得到的参数可以在component对应组件内通过this.params.参数名调用。

例子

[
    ...
	{
		name: "Score",
		url: "/courses/:courseID/:SNo/score",
		component: ScoreComponent
	},
	{
		name: "RegExp",
		url: /^(\/?regExp)/, // 获取以regExp开头的路径
		getParams: (url) => {
			return {
				name: url.split("/").pop()
			}
		},
		component: RegExpTestComponent
	}
	...
]

使用方法

goTo

  跳转至指定路由。

  • 参数列表

    1. name (string): 路由内置名
    2. options (object): 将传入component中构造函数参数列表的第一项，已实例化或构造函数未覆写的组件的将作为其attribute值；其中的params属性为路由参数对象，将来可在组件内以this.params的方式调用。
    3. urlChanged = false (boolean): 为true则不会更新history栈，为false反之，一般保持默认值即可，不需要特别配置。

  • 返回值

    空

Contributors: vitnova