v模型不会检测到jquery触发事件所做的更改

Question

通过Vue.js，我正在使用jQuery Tempus Dominus datepicker。

<input type="text"
       class="form-control datetimepicker-input"
       id="confirmedDueDate"
       data-target="#confirmedDueDate"
       @focus="openDatetimePicker($event)"  //to show the datetimepicker
       @blur="closeDateTimePicker($event)"  //to close it
       v-model="taskSettings.confirmedDueDate"
       />

我面临以下问题：v-model无法检测到所做的更改datetimepicker。

我以为我可以在关闭选择器时触发事件：

$('#confirmedDueDate').trigger('change');
//or
$('#confirmedDueDate').trigger('input');

但这不起作用。

是否有针对此类情况的已知解决方法？

Answer 1

命令

$('#confirmedDueDate').trigger('input');

触发Vue无法识别的jQuery.Event对象，因为它仅知道本机DOM事件。

您可以使用以下方式“手动”触发Vue将响应的事件：

$('#confirmedDueDate')[0].dispatchEvent(new CustomEvent('input'));

Vue会将其识别为常规的本地inputevnet。