当用户选择一个选项时，Select2.js下拉UI的行为有所不同

Question

我在rails应用程序中使用select2.js进行下拉。一旦选择了一个选项，则应在页面加载后使用指定的URL来保持选择的选项值。一切正常，除了页面加载下拉菜单时，UI在显示所选的实际选项值之前先显示上一个选项。

代码：

<div data-controller="dropdown">[![enter image description here][1]][1]
<select id="airlineMenu">
    <option value="/abc">Account1</option>
    <option value="/xyz">JetBlue</option>
    <option value="/def">Account2</option>
</select>
</div>

JS

import { Controller } from 'stimulus';

export default class extends Controller {

  initialize(){

    $('select#airlineMenu').val(window.location.pathname).select2();
    $('#airlineMenu').trigger('change.select2');
    $("#airlineMenu").on("select2:select", function (e) {
      var data = e.params.data.id;
      Turbolinks.visit(data);
    });
  }
}

我已附上图片以供参考。请让我知道如何克服这个问题？