Search code examples
layoutmeteorroutesflow-router

meteor with flow router layout is rendered twice


I don't know why but my layout is rendered two times.

Here is my index.html:

<head>
  <title>title</title>
</head>

<body>
  {{>layout}}
</body>

Here is my layout:

<template name="layout">
  {{#if canShow}}
    {{>Template.dynamic template=content}}
  {{else}}
    {{> loginButtons}}
  {{/if}}
</template>

So here without route my template is display just one time.

Here is my route:

FlowRouter.route('/', {
  action() {
    BlazeLayout.render("layout", {
      content: "home"
    });
  }
});

But with this route my template is display a second time.

This is my helpers, I think there is nothing to do with this problem but we never know.

Template.home.onCreated(function() {
  this.autorun(() => {
    this.subscribe('post');
  });
});


Template.layout.helpers({
  canShow() {
    return !!Meteor.user();
  }
});


Template.home.helpers({
  cats() {
    return Posts.find({});
  }
});

Solution

  • you don't need to render layout in the body.

    The router will take care of the rendering.

    so, just have

    <body>
    </body>
    

    or don't even have it at all.

    Edit: Thanks to Keith, I have a better understanding of my problem. Here is his comment:

    one thing to keep in mind, all the html you write in meteor isn't kept as html. It all gets converted to javascript. Things like index.html do not get pushed to the browsesr. Meteor just takes all the html you write converts it to javascript and renders what it needs to based on what your code says. This is how it knows todynamically change and rerender html

    For things like changing title of the head or add meta etc, we can do it directely in the javascript.

    ex: Meteor - Setting the document title