v-model不会检测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 Object，因为它只知道本机DOM事件。

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

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

Vue会将其识别为常规原生input evnet。