router.js 使用教程

项目介绍

router.js 是一个轻量级的 JavaScript 路由库，构建在 route-recognizer 和 RSVP 之上，提供了一个用于处理路由的 API。它遵循 Unix 哲学，是一个模块化的库，专注于一件事并将其做好。router.js 是 Ember.js 使用的路由微型库。

项目快速启动

安装

使用 npm 安装 router.js：

npm install --save router_js rsvp route-recognizer

创建和配置路由

创建一个新的路由器并添加路由：

var Router = require('router_js');

var router = new Router();

router.map(function(match) {
  match("/posts/:id").to("showPost");
  match("/posts").to("postIndex");
  match("/posts/new").to("newPost");
});

// 添加处理程序
var myHandlers = {};

myHandlers.showPost = {
  model: function(params) {
    return App.Post.find(params.id);
  },
  setup: function(post) {
    // 渲染一个模板，包含 post
  }
};

myHandlers.postIndex = {
  model: function(params) {
    return App.Post.findAll();
  },
  setup: function(posts) {
    // 渲染一个模板，包含 posts
  }
};

应用案例和最佳实践

嵌套路由

你可以嵌套路由，每个嵌套级别都可以有自己的处理程序。例如，一个主从视图：

router.map(function(match) {
  match("/posts").to("posts", function(match) {
    match("/").to("postIndex");
    match("/:id").to("showPost");
  });
});

myHandlers.posts = {
  model: function() {
    return $.getJSON("/posts").then(function(json) {
      return App.Post.load(json);
    });
  },
  setup: function(posts) {
    // 渲染一个模板，包含 posts
  }
};

生成路由

你可以生成路由，支持字符串和对象的混合使用：

var myRouter = new Router();

myRouter.generate("postVersion", { id: 4, modeName: 'a' }, { id: 'first' });
// 返回 '/posts/4/a/version/first'

典型生态项目

router.js 是 Ember.js 的核心组件之一，与 Ember.js 紧密集成。Ember.js 是一个用于构建现代 web 应用程序的框架，提供了路由、数据绑定、模板等功能。

Ember.js

Ember.js 是一个开源的 JavaScript 框架，用于创建复杂的单页应用程序。它结合了最佳的开发实践和强大的功能，使得开发人员可以快速构建可维护和可扩展的应用程序。

其他相关项目

• route-recognizer: 一个用于路由匹配的库，router.js 依赖于它。
• RSVP: 一个 Promise 库，router.js 使用它来处理异步操作。

通过这些项目的结合使用，router.js 提供了一个强大而灵活的路由解决方案，适用于各种规模的 web 应用程序。