定义一个简单的路由

路由的基本目的是匹配确定的URL并以执行某项操作作为结果。这一切都发生在客户端,在用户的浏览器应用中或者移动端的应用容器中。让我们通过示例应用Todos动手做一个例子:

FlowRouter.route('/lists/:_id', {
  name: 'Lists.show',
  action(params, queryParams) {
    console.log("Looking at a list?");
  }
});

路由的处理器将在这两种情形下运行:页面最初以一个匹配格式的URL地址载入,或者当页面已经打开时URL被更改为另一个匹配格式的URL。需要注意的是,这与在服务端渲染的应用不同,URL可以在不向服务器端发送任何额外请求的前提下被更改。

当路由被匹配时,action方法会被执行,并且你可以执行一些你想要去做的动作。路由的name属性是可选的,但它将使我们在之后更方便的处理路由。

URL格式匹配

仔细查看一下被用在上述代码片段中的URL格式:

'/lists/:_id'

这个格式将匹配一个确定的URL地址。你或许注意到了一部分的URL被放在:之后 - 这表示它是一个 url参数 ,路由将匹配地址中这部分所呈现的任何字符。Flow Router把这部分URL放在当前路由的params属性中。

另外,URL可以包含HTTP query string (在?之后的部分)。这种情况下,Flow Router也会把它放入名为queryParams的参数中。

这里有一些URL的示例以及产生的paramsqueryParams

URL地址 是否进行格式匹配? params queryParams
/
/about
/lists/
/lists/eMtGij5AFESbTKfkT { _id: "eMtGij5AFESbTKfkT"} { }
/lists/1 { _id: "1"} { }
/lists/1?todoSort=top { _id: "1"} { todoSort: "top" }

注意,URL并没有编译数据类型的方法,所以所有的paramsqueryParams的值都是字符型。举个栗子,如果你希望某个参数表现为数字型,当你访问它时可能需要用parseInt(value, 10)来进行类型转换。

results matching ""

    No results matching ""