是否可以为多个实例重用 flatpickr 窗格的 DOM？答案

【问题标题】：Is it possible to reuse the DOM of flatpickr pane for multiple instances?是否可以为多个实例重用 flatpickr 窗格的 DOM？
【发布时间】：2019-09-19 21:28:12
【问题描述】：

我们使用flatpickr 提供统一的界面来编辑日期。在一个例子中，有一个包含许多（数百）行的表，每一行都有一个我们使用 flatpickr 的日期输入。

鉴于一次只会打开一个 flatpickr，是否有可能避免在 DOM 中创建数百个隐藏窗格，而是为所有这些窗格使用一个？

【问题讨论】：

标签： javascript flatpickr

【解决方案1】：

所以我们在 AngularJS 应用程序中遇到了类似的问题。我们找到的解决方法是在输入字段中添加一个 FocusHandler，在该处理程序中创建 flatpickr 实例，然后在该实例上调用 .open()。

handleFocus = () => {
  const config = {...}
  this.flatpickrInstance = flatpickr(this.input, config);
  this.flatpickrInstance.open();
};

为了清理，我们还在输入字段中添加了一个 BlurHandler，以在保存的 flatpickr 实例上调用 .destroy()。这里唯一的问题是.destroy() 将清除输入字段的值，因此我们需要在调用destroy 后立即设置值，如下所示：

handleBlur = () => {
  const val = this.flatpickrInstance.input.value;
  this.flatpickrInstance.destroy();
  this.input.value = val
};

【讨论】：