2016-06-16 9 views
3

Iron-RouterをFlow-Routerに置き換えた新しいMeteorプロジェクトに移行するときに、Iron-Routerの機能が欠けていて、デフォルトの動作とグローバルに使用可能な設定。FlowRouterでデフォルトのレンダリングテンプレートを定義する良い方法

私はFlow-Routerが "group"構造を使用して、そのグループに接続されたどのルートにも適用できるデフォルトフックイベントを定義できると理解していますが、デフォルトテンプレートを定義するためには、

このタイプのデフォルトグローバルまたはグループテンプレート機能を実装する最良の方法は何ですか?

答えて

1

は、以下の更新:

を私はこれを行うにはかなり効果的かつ効率的な方法だと思うものをしてきました。

フロールータの機能の見直しでは、私は関係なく、かどうかの、FlowRouter.current().route.group.options

にこのオブジェクトはグループで定義された任意のキーと値のペアが含まれている、ルータのオブジェクトは、すべてのグループパラメータを含むフィールドを含んでいることに気づきましたそれらはFlow-Router APIによって使用されるかどうかにかかわらず使用されます。

私はこれを、グループのいくつかのテンプレートのデフォルトをルータに渡す簡単な方法としてこれを使うことにしました。

まずグループの定義である:

var mainRoutes = FlowRouter.group({ 
    name: "mainRoutes", 
    defaultTemplates: { 
    menu: "mainMenu", 
    breadcrumb: "mainCrumb", 
    sidebarLeft: "sidebarLeft", 
    sidebarRight: "sidebarRight", 
    footer: "mainFooter" 
    } 
}); 

次にルートを定義する際に、我々はそれがフロールータの既存の機能を使用していますので、私はこのパターンが好きthis.group.options.defaultTemplates

mainAppRoutes.route('/', { 
    name: "home", 
    action: function() { 
    // Get the defaultTemplates object 
    var templates = this.group.options.defaultTemplates; 
    // Add route specific templates 
    templates.content = "homeScreen"; 
    // Pass all the templates to the renderer 
    BlazeLayout.render("appLayoutMain", templates); 
    } 
}); 

からこれらにアクセスすることができ、かつルート内にコードが1行追加され、グループ全体のデフォルトテンプレートの定義が可能になります。これは基本的にIron-RouterがテンプレートデフォルトをRouter.config()で使用しているのを模倣しており、ローカルルートテンプレート定義の利点はデフォルトテンプレートオブジェクト全体を上書きしないという利点があります。

  • UPDATE 私はそれが一貫して動作させるために解決しなければならなかったhaving another problemを終わるなかったが上記の、私のためによく働いています。フロールータは、非反応性であるため、我々は、ローカルroute.action機能では、やっているとして、あなたが任意の基礎となる「ルートのデフォルトを」変更した場合

基本的には、ルータグループオブジェクトがあればルートへのルートから持続すると思われますルートが同じグループにあるためです。また、この「オプション」オブジェクトはルート定義からルータに渡されます。つまり、上のケースでデフォルトのパラメータを上書きすると、それを上書きするルートが呼び出された後、その同じグループを使用するすべての後続のルートで上書きされます。

私が思いついた解決策は、グループ定義でtriggersExit: [ resetDefaults ]のようにデフォルトリセット機能を実行することでした。

次に、デフォルトをリセットするだけです。

function resetDefaults (context) { 
    context.route.group.options.defaultLayoutTemplate = "mainAppLayout"; 
    context.route.group.options.defaultTemplates = { 
    defaultTeamplates: "navMain", 
    // ... 
}; 
+0

簡単に言えば、ネストされたテンプレートの親にアクセスするには、 'FlowRouter.current()。group.parent.options.defaultTemplates'を介してネストされたグループの親にアクセスできます – robertdavid

2

Iron-Routerのこの機能のシミュレーションを可能にする単純な抽象化を使用することにしました。この機能をFlowRouter自体に直接統合する前に、これが健全で拡張可能なパターンであるかどうかを評価し、同様の解決策を探している他の人とこのアイデアを共有したいと考えています。

私は単純にパラメータオブジェクトテンプレートとして使用されるオブジェクトを作成しました。このオブジェクトは必要に応じて変更され、BlazeLayout.renderを呼び出すときに渡されます。これは、あなたがすべてのルートのためにそれらを再定義しなくても、デフォルト・グループ・テンプレートをレンダリングできるようになります

var appRouteGroup = FlowRouter.group({ 
    name: "appRouteGroup", 
    triggersEnter: [sometrigger] 
}); 

var appRouteTemplates = { 
    menuMain: "appNav", 
    footerMain: "appFooter" 
}; 

appRouteGroup.route("home", { 
    name: "home", 
    action: function() { 
    // We get the default templates 
    var templates = appRouteTemplates; 

    // Now we can add the route specific template 
    templates.content = "homePage"; 

    // Then render with templates passed through the object param 
    BlazeLayout.render("mainLayout", templates); 
    } 
}); 

これはroutes.jsように見えるかもしれないものです。そして、テンプレートのマークアップで次のように:私は多分FlowRouter内のより直接的な統合を作るための方法を探していますが、これは完全に機能的なようだ

<template name="mainLayout"> 
    {{>Template.dynamic template=menuMain}} 

    {{>Template.dynamic template=content}} 

    {{>Template.dynamic template=footerMain}} 
</template> 

。改善のためのどんな考えですか?

+0

また、ローカルルート定義では、Iron-Routerが選択的に許可しなかったデフォルトのテンプレートを選択的に上書きできるようになりました。 。 – robertdavid

1

私が見つけた別の解決策を提出したいと思います。これは、Flow-routerの経路「デフォルト」パラメータを作成するためのより包括的な方法を追加します。

それはFlow-router-treeと呼ばれる大気パッケージを使用しています。

このパッケージには、1が「親」にリンクさせることができる「ノード」のシリーズとしてルートを定義することができ、その後、定義内に設定されたデフォルトのパラメータを継承れますその親のこのパッケージのコメントを他の人に見ても面白いでしょう。

関連する問題