Ember 路由重定向

聲明：對(duì)于transition這個(gè)詞直譯是“過渡”的意思，但是總覺得“路由的過渡”讀起來總有那么一點(diǎn)別扭，想了下于是就用“切換”替代吧，如有不妥歡迎指正。

我們熟知的Java、PHP等語(yǔ)言都提供了URL的重定向，那么Ember的重定向又是怎么去實(shí)現(xiàn)的呢？

如果是從路由重定向到另外一個(gè)路由你可以調(diào)用transitionTo方法，如果是從controller重定向到一個(gè)route則調(diào)用transitionToRoute方法。transitionTo方法所實(shí)現(xiàn)的功能與link-to的作用是一樣的，都可以實(shí)現(xiàn)路由的切換。 如果重定向之后的路由包含有動(dòng)態(tài)段你需要解析model數(shù)據(jù)或者指定動(dòng)態(tài)段的值。由于不是直接執(zhí)行URL所以不會(huì)執(zhí)行重定向之后的路由的model回調(diào)。

1，切換路由前獲取model

如果你想在路由切換的時(shí)候不加載model你可以調(diào)用beforeModel回調(diào)，在這個(gè)回調(diào)中實(shí)現(xiàn)路由的切換。

beforeModel() {
    this.transitionTo('posts');
}

2，切換路由后獲取model

有些情況下你需要先根據(jù)model回調(diào)獲取到的數(shù)據(jù)然后判斷跳轉(zhuǎn)到某個(gè)路由上。此時(shí)你可以使用afterModel回調(diào)方法。

afterModel: function(model, transition) {
    if (model.get(‘length’) === 1) {
        this.transitionTo('post', model.get('firstObject'));
    }
}

切換路由，并初始化數(shù)據(jù)為model的第一個(gè)元素?cái)?shù)據(jù)。

3，重定向到子路由

Router.map(function() {
    this.route('posts', function() {
        this.route('post', { path: '/:post_id'});
    }); 
});

子路由的重定向有些許不同，如果你需要重定向到上面這個(gè)段代碼的子路由posts.post上，如果是使用beforeModel、model、afterModel回調(diào)重定向到posts.post父路由posts會(huì)重新在執(zhí)行一次，再次執(zhí)行父路由這種方式就顯得有點(diǎn)多余了，特別父路由需要加載的數(shù)據(jù)比較多的時(shí)候，會(huì)影響到加載的效率。 如果是這種情況我們可以使用redirect回調(diào)，此回調(diào)不會(huì)再次執(zhí)行父路由。僅僅是實(shí)現(xiàn)路由切換而已。

redirect: function(model, transition) {
    if (model.get('length') === 1) {
        this.transitionTo('posts.post', model.get('firstObject'));
    }
}

重定向到子路由，解析之后會(huì)得到的類似于posts/2這種形式的URL。

以上就是全部路由的重定向方式，主要有4個(gè)回調(diào)：beforeModel、model、afterModel、redirect。前面三種使用場(chǎng)景差別不大，redirect主要用于重定向到子路由。

博文完整代碼放在Github（博文經(jīng)過多次修改，博文上的代碼與github代碼可能又出入，不過影響不大?。?，如果你覺得博文對(duì)你有點(diǎn)用，請(qǐng)?jiān)趃ithub項(xiàng)目上給我點(diǎn)個(gè)star吧。您的肯定對(duì)我來說是最大的動(dòng)力??！