如何修复关于Flatpickr重新创建

问题描述：

我使用flatpickr与角度1.5.0，es6 env，flatpickr版本是3.0.6，我绑定了一个输入事件以打开flatpickr，当日历打开时，它立即关闭，但是当我点击使用触摸板的输入，而不是点击，它运作良好。问题是什么？如何修复关于Flatpickr重新创建

我试着用jQuery来绑定事件，结果是一样的。我的操作系统是Mac。

我的片段：

import flatpickr from 'flatpickr' 

$scope.showPicker = function() { 
    flatpickr(document.getElementById('date-input'), { 
    locale: zh.zh, 
    onChange: function(selectedDates, dateStr) { 
     $scope.currDay = dateStr 
     $scope.reqDetail($stateParams.gid, dateStr) 
    } 
    }) 
} 

<input 
    ng-model="currDay" 
    readonly="readonly" 
    id="date-input" 
    ng-click="showPicker()" 
>

我要求在正式发布，维护者说不是插件自身的问题。

我该如何解决这个问题？

答

我解决了这个问题，这个问题是因为recreateing无限次的，我通过这种方式解决：

$scope.fpCache = [] 
$scope.showPicker = function() { 
if($scope.fpCache.length == 0) { 
    const fp = new Flatpickr(document.getElementById('date-input'), { 
    locale: zh.zh, 
    onChange: function(selectedDates, dateStr) { 
     $scope.currDay = dateStr 
     $scope.searchByDate(dateStr) 
    } 
    }) 
    fp.open() 
    $scope.fpCache.push(fp) 
} else { 
    $scope.fpCache[0].open() 
} 
// $('#date-input').flatpickr({}) 
// flatpickr(document.getElementById('date-input'), { 
// locale: zh.zh, 
// onChange: function(selectedDates, dateStr) { 
//  $scope.currDay = dateStr 
//  $scope.searchByDate(dateStr) 
// } 
// }) 
}

我创建了一个高速缓存阵列以创建单个实例，它工作得很好。

如何修复关于Flatpickr重新创建

相关推荐