Question

我使用铁路由器和图表，我有一个模板chart，当我刷新页面时会显示图表，但是当我离开并返回时却没有。 div仍然存在，空间被占用，但图表没有显示。

Template.chart.onRendered(function () {

    new Chartist.Line('.ct-chart', {
        labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'],
        series: [
            [12, 9, 7, 8, 5],
            [2, 1, 3.5, 7, 3],
            [1, 3, 4, 5, 6]
        ]
    }, {
        fullWidth: true,
        chartPadding: {
            right: 40
        }
    });
});

https://atmospherejs.com/mfpierre/chartist-js

以下工作正常，但显然不是正确的方法：

 Template.chart.onRendered(function () {

setTimeout(function() {

    new Chartist.Line('.ct-chart', {
        labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'],
        series: [
            [12, 9, 7, 8, 5],
            [2, 1, 3.5, 7, 3],
            [1, 3, 4, 5, 6]
        ]
    }, {
        fullWidth: true,
        chartPadding: {
            right: 40
        }
    });

  },2000); 
});

在我的router.js：

Router.map(function() {
    this.route('join');
    this.route('chart');
    //etc.
})

Answer 1

我无法重现您的错误。以下工作正常，我可以毫无问题地在两条路线之间导航（从other导航时图表重新出现。）

HTML：

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

<template name="chart">
  <div class="ct-chart">
    Chart
  </div>
  {{#linkTo route="other"}}other{{/linkTo}}
</template>

<template name="other">
  Other
  {{#linkTo route="chart"}}chart{{/linkTo}}
</template>

JS：

if (Meteor.isClient) {

    Template.chart.onRendered(function () {

        new Chartist.Line('.ct-chart', {
            labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'],
            series: [
                [12, 9, 7, 8, 5],
                [2, 1, 3.5, 7, 3],
                [1, 3, 4, 5, 6]
            ]
        }, {
            fullWidth: true,
            chartPadding: {
                right: 40
            }
        });
    });
}


Router.route('/chart', function () {
    this.render('chart');
});

Router.route('/other', function () {
    this.render('other');
});

为什么图表只在我刷新时呈现，但在我离开并返回时消失？

1 个答案: