Rails 4：单击链接时不显示 Morris.js 图表答案

【问题标题】：Rails 4: Morris.js chart doesn't display when link is clickedRails 4：单击链接时不显示 Morris.js 图表
【发布时间】：2016-04-10 21:55:52
【问题描述】：

我有一个显示 Morris.js 图表的仪表板页面。如果我手动键入 URL 或刷新页面，图表会正确显示，但如果我单击应用程序中的链接以加载仪表板，则图表将不会显示。看来这是 turbolinks 的问题。

我找到了a strategy，我相信它可以让图表显示在链接点击上，但我不知道如何实现它，因为我对 Javascript 不是很熟悉。

dashboard.html.erb：

...
<div class="col-lg-12">
  <div class="panel panel-default">
    <div class="panel-heading">
      <h3 class="panel-title"><i class="fa <%= icon_name %> fa-fw"></i> <%= description %> Chart</h3>
    </div>
    <div class="panel-body">
      <%= content_tag :div, "", 
            id: 'laser_sheets_chart',
            data: {sheets_stats: result.to_json} %>
    </div>
  </div>
</div>
...

pages.coffee：

jQuery ->
    Morris.Line({
        element: 'laser_sheets_chart',
        data: $('#laser_sheets_chart').data('sheets-stats')
        xkey: 'date',
        ykeys: ['cut', 'programmed'],
        labels: ['Cut', 'Programmed'],
        xLabels: "day"
        pointSize: 3,
        hideHover: 'auto',
        resize: true,
        smooth: true
    });

【问题讨论】：

标签： javascript ruby-on-rails turbolinks morris.js

【解决方案1】：

你说得对，这是 turbolinks 的问题。您可以通过设置在指向仪表板页面的链接上禁用此功能：

data-no-turbolink='true'

或使用 link_to rails 助手：

link_to('Dashboard', data: { no_turbolink: true })

【讨论】：