0

我是showdown-rails第一次使用 gem 并且在让它出现时遇到了一些麻烦。我按照 GitHub 页面上的说明运行了 gem 的安装，将它包含在我的application.js文件中，并带有//= require showdown. 我使用以下代码_form在我的wikis#edit/页面上部分使用它：wikis#new

<%= form_for(@wiki) do |f| %>
  <%= f.label :title %><br>
  <%= f.text_field :title, class: "form-control" %>

  <%= f.label :body %><br>
  <%= f.text_area :body, class: "form-control", style: "height: 250px", id: "wiki_body" %>


  <% if current_user.admin? || current_user.premium? %>
    <%= f.label :private, class: 'checkbox' do %>
      <%= f.check_box :private %> Make Wiki Private
    <% end %>
  <% end %>

  <% if @wiki.private? %>
    <%= f.label "Add Collaborators", class: 'checkbox' %>
    <div style="height: 80px; overflow: scroll; border: thin grey solid; padding-left: 10px">
      <% @users.each do |user| %>
        <%= check_box_tag "wiki[user_ids][]", user.id, @wiki.users.include?(user) %>
        <%= user.name %><br>
      <% end %>
    </div>
  <% end %>

  <script>
    var converter = new showdown.Converter();
    $('#wiki_body').on('keyup', function() {
      var mdown = $(this).val();
     $('#wiki_preview').html(converter.makeHtml(mdown));
    });
  </script>

  <div class="well" style="margin-top: 20px">
    <p id="wiki_preview"></p>
  </div> <!-- showdown well -->

  <div class="text-center">
    <%= f.submit "Create Wiki", class: "btn-custom" %>
  </div> <!-- text-center -->
<% end %>

井出现了，但Showdown应该呈现的实际文本永远不会出现。这是我第一次使用 gem，所以我不确定我哪里出错了。谁能在这里指出我的错误？

4

1 回答 1

0

虽然这个问题有点老，但我有同样的问题，因为还没有答案，所以我想我会分享我的结果。

首先，不直接在视图中编写 JavaScript 被认为是一种好习惯，但您应该使用assets/javascript子目录下的相应文件，即assets/javascripts/wiki.js.

其次，我遇到了 rails 无法使用安装的版本正确加载导入的 javascript 的问题。我Reference Error: showdown is not defined上了我的 JavaScript 控制台。奇怪的是，只是运行bundle update解决了这个问题。

第三，我遇到这个代码有一些问题turbolinks，默认情况下是由rails激活的。基本上，您需要确保在 turbolinks 设置页面后加载您的脚本。$(document).on('turbolinks:load', function()在您的情况下，您可以通过在函数之前插入来确保这一点

$(document).on('turbolinks:load', function() {
    var converter = new showdown.Converter();
    $('#wiki_body').on('keyup', function() {
        var mdown = $(this).val();
     $('#wiki_preview').html(converter.makeHtml(mdown));
    });
}

您可以检查views/layouts/application.html.erb文件中是否激活了 turbolinks，如果激活了 turbolinks，您将有一行说<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload'%>

于 2017-03-09T01:47:00.987 回答