用vuex中的datetime组件,选择日期的弹窗弹起来的时候跳转浏览器,请问各位有遇到过这个情况吗?
<group>
<datetime title="" start-date="1990-01-01" end-date="2023-05-26" formatter="YY-MM-DD" :value="form.startTime" placeholder="请选择参加工作开始时间" style="width: 100%;padding: 0;margin: 0px;"></datetime>
</group>
在 datetime 组件上添加 stop-propagation 属性,将该属性值设为 false
<datetime title="" start-date="1990-01-01" end-date="2023-05-26" formatter="YY-MM-DD" :value="form.startTime" placeholder="请选择参加工作开始时间" style="width: 100%;padding: 0;margin: 0px;" stop-propagation="false"></datetime>
监听 datetime 组件的 click 事件,在事件处理函数中手动停止事件冒泡,避免跳转浏览器,代码如下:
<datetime title="" start-date="1990-01-01" end-date="2023-05-26" formatter="YY-MM-DD" :value="form.startTime" placeholder="请选择参加工作开始时间" style="width: 100%;padding: 0;margin: 0px;" @click.stop="handleDatetimeClick"></datetime>
// 在 Vue 实例中定义 handleDatetimeClick 方法
methods: {
handleDatetimeClick(event) {
// 停止事件冒泡
event.stopPropagation();
}
}
第二次跳转 可以尝试给 datetime 组件添加一个 v-model 指令来绑定一个数据属性,并在该数据属性上添加一个计算属性来防止 datetime 组件失去焦点。:
不是vuex吧,是vue中。