鐵流路由器與流星之間的動畫頁面轉換

目前，我發現的路由間動畫的唯一解決方案是淡出當前頁面onBeforeAction並淡入新頁面onAfterAction。但這只是跛腳。我想嘗試執行some really sleek transitions like these。鐵流路由器與流星之間的動畫頁面轉換

我認爲這需要在頁面上同時呈現多個頁面，但這似乎是非常耗費資源，甚至似乎根本不使用鐵路路由器。

任何想法，我可以如何實現這一點？

來源

2014-09-13 Chet

這個問題似乎被問到一個相當數量，並沒有明確的解決方案，並有很多答案變得陳舊，或至少不適用於最新的鐵路由器和流星1.0。

我只是做了一堆的最佳答案摸索和至少今天看來這個包是：

https://github.com/percolatestudio/momentum-iron-router/ 和 https://github.com/ccorcos/meteor-transitioner/

前者在尚未更新一會兒，但有很多提交。後者的提交很少，但可能正在積極地開展工作。

我在進展試圖出來，所以如果我還記得我會回來檢查。

來源

2015-01-31 21:45:10 funkyeah

嘿，我其實只是做了後者。哈哈。我忘了這個問題 – Chet 2015-02-04 05:43:24

僅供參考 - 我只是在Meteor 1.1.0.3上試過這兩個。我在'momentum-iron-router'上遇到了一些錯誤（還有一些人在問題頁面上都有相同的問題，'ccorcos：meteor-transitioner'正在運行，很容易上手。 – evolross 2015-08-18 03:51:27

我使用這樣http://meteorpad.com/pad/5kii9SRbbnjiTHeQe

的MeteorPad不允許使用IronRouter的解決方案，所以我的例子中不使用它。在IronRouter中，您可以使用action（）方法設置「currentPage」會話變量並始終呈現「transitioner」模板。像這樣：

Router.map(function() { 
    this.route('home', { 
    path: '/', 
    action: function() { 
     Session.set('currentPage', 'home'); 
     this.render('transitioner'); 
    } 
    }); 

    this.route('about', { 
    action: function() { 
     Session.set('currentPage', 'about'); 
     this.render('transitioner'); 
    } 
    }); 
});

我使用這個包裝。它也幫助我定義轉換樣式和方向。

而且要小心訂閱/取消訂閱，因爲在轉換完成前，上一頁會對訂閱內容做出反應！

來源

2014-09-13 10:41:26

meteorpad是不是爲我工作的權利，但我看到你在這裏做什麼。看起來像一個痛苦，但。但是，再次，我沒有看到任何其他的做法...：/ – Chet 2014-09-16 07:22:03

是的，我認爲你可以用更有用的方式組織所有這些，但原則將保持不變。或者您可以等待Iron-Transitioner的更新，但它也使用相同的原理，並且很長一段時間沒有更新。 – 2014-09-16 15:54:46

嗯。謝謝您的幫助。讓我看看我能想出什麼 – Chet 2014-09-24 19:31:01

鐵流路由器與流星之間的動畫頁面轉換

回答

相關問題