当我尝试在 rails 6 中使用 select 2 时出错

Question

我正在尝试通过 gem select2-rails.

在 rails 6 中使用 select2

我已经在 gem 文件中添加 gem "select2-rails" 运行 bundle 和 yarn add select2 并导入 .js require("select2") 但是当我尝试使用我得到这个错误

$(...).select2 is not a function

我怎么解决这个问题？

Answer 1

您可以按照以下步骤在 Rails 6 中设置 select2：

根据项目自述文件，在您的 Rails 项目中正确安装 Webpacker。如果您从 Rails 6 应用程序开始，这将默认完成。
同时添加 jquery 和 select2:
```
yarn add jquery select2 
```

在 DOM

中添加一个 select 框

<select class="js-states" name="state">
  <option value="AL">Alabama</option>
   ...
  <option value="WY">Wyoming</option>
</select>

导入jquery、select2和select2 css并在页面加载时应用于select框:

import $ from 'jquery'
import 'select2'
import 'select2/dist/css/select2.css'

window.addEventListener('DOMContentLoaded', () => {
  $('.js-states').select2()
})

为了开发，在config/webpacker.yml中设置compile: true。运行 webpack-dev-server 是可选的。

更多你也可以查看这个演示：https://github.com/rossta/rails6-webpacker-demo/compare/example/select2

当我尝试在 rails 6 中使用 select 2 时出错

Error when i try to use select 2 in rails 6

ruby-on-rails

jquery-select2

ruby-on-rails-6