如何解决flatpickr 未加载 rails 6 + webpacker
我正在尝试将 flatpickr 与 Rails 6 一起使用,但由于某种原因它似乎不起作用。
我做了以下事情:
yarn add flatpickr
在我的文件中,我有以下内容:
packs/application.js
// This file is automatically compiled by Webpack,along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.
import 'core-js/stable'
import 'regenerator-runtime/runtime'
import Rails from '@rails/ujs';
import Turbolinks from 'turbolinks';
import * as ActiveStorage from '@rails/activestorage';
import 'channels';
Rails.start();
Turbolinks.start();
ActiveStorage.start();
import('jquery');
import('tooltip-js');
import('../components/main.js');
import('../components/lib_ext.js');
import('../components/dialog.js');
import('../components/widgets.js');
import('../components/classes.js');
import('../components/payroll.js');
import('../components/account_context_menu.js');
import('../components/plan_table.js');
import('../components/requirements.js');
import('../components/help.js');
import('../components/help_data.js');
import('../components/scripts.js'); // nav js
import('../components/additional.js');
import('../components/effects.js');
import('../components/consolidated_orders');
import('../components/sales_invoices.js');
import('../components/journals/auto_reversal.js');
import('../components/budgets/new.js');
import('../components/budgets/export.js');
import('../components/new.js');
import('../stylesheets/application.scss');
const images = require.context('../images',true)
// flatpickr
import flatpickr from 'flatpickr'
require("flatpickr/dist/flatpickr.css");
flatpickr("[data-behavior='flatpickr']",{
altInput: true,altFormat: "F j,Y",dateFormat: "Y-m-d",});
<%= f.text_field :company_year_end,data: { behavior: 'flatpickr' } %>
这里的结果是选择器根本不显示。在控制台中,我没有看到任何与 flatpickr 相关的错误。
解决方法
知道了,必须使用 turbolinks 加载
document.addEventListener('turbolinks:load',() => {
flatpickr("[data-behavior='flatpickr']",{
altInput: true,altFormat: "F j,Y",dateFormat: "Y-m-d",});
})
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。