在 Rails 5 中单击浏览器上的后退按钮时，带有 Select2 的表单会重复

Answer 1

在此回复： https://stackoverflow.com/a/41915129/5758027

我在自己的代码中使用了这个解决方案：

    $(document).on('turbolinks:before-cache', function() {     // this approach corrects the select 2 to be duplicated when clicking the back button.
        $('.select-select2').select2('destroy');
        $('.select-search-select2').select2('destroy');
    } );

和观察者：

    $(document).ready( ready );                  //... once document ready
    $(document).ajaxComplete( ready );           //... once ajax is complete
    $(document).on('turbolinks:load', ready );   //... once a link is clicked

    function ready() {
        $(".select-search-select2").select2({
            theme: "bootstrap",
            language: 'es',
            allowClear: true
        });

        $(".select-select2").select2({
            theme: "bootstrap",
            language: 'es',
            minimumResultsForSearch: Infinity,
            allowClear: true
        });
    };

Answer 2

总是清除缓存不是会让使用 Turbolink 变得毫无意义吗？

不如这样？

$(document).on('turbolinks:before-cache', function(e) {
  return $('.form-control.select2').each(function() {
    return $(this).select2('destroy');
  });
});

Answer 3

我无法解决这个渲染问题（仍在等待正确的答案！），但如果有人像我一样遇到类似的问题，请尝试跳出框框思考。这是我的技巧：我在应用程序中添加了一个后退按钮。

获取完整的url路径

# get the previous url 
def save_previous_page
    session[:return_to] = request.fullpath
end

仅当页面不是主页或搜索页面时才显示后退按钮

<% if session[:return_to] != request.fullpath%>
   <%= link_to session.delete(:return_to) || request.fullpath, class: 'back-button' do%>
     <i class="fa fa-arrow-circle-left" aria-hidden="true"></i>
   <%end%>
<% end %>

同时，我仍在等待并尝试解决渲染问题...

解决了问题

只需将此代码添加到您的 .js 文件中

Turbolinks.clearCache();

Answer 4

这很可能是一些资源不一致，您应该检查您的

app\views\layouts

文件夹中是否有重复声明 wither jQuery、jQuery UJS 或 Turbolinks 的文件。检查页面的所有

<script>

标签，以及是否在

layout

文件夹和内部视图中声明相同的脚本。如果情况并非如此，请检查是否有

render

、

yield

或

build

呼叫

Answer 5

简单的解决方案，不要在您不希望它运行的东西上运行 select2 构建器。

$("select#category:not(.select2-container):not(.select2-hidden-accessible)").select2();

Answer 6

Rails 7 更新

这里的很多东西在 Rails 7 中都不起作用，尤其是

turbolinks:before-cache

事件。您正在寻找的新事件是

turbo:before-cache

和

turbo:load

，所以它看起来像这样：

$(document).on("turbo:before-cache", function() {
    $("#select_id").select2('destroy');
});

$(document).on('turbo:load', function() {
    $('#select_id').select2();
});