vue框架下使用element-ui的DateTimePicker，怎么控制只有在点击“确定”按钮和“此刻”按钮时修改时间？-灵析社区

问题已解决。 问题1：点击组件外部区域时，也会触发change事件解决思路：经过查看element-ui源码，发现组件使用自定义指令v-clickoutside，触发了handleClose函数，且此函数只有此处调用。因此在封装的父组件中重写handleClose，调用时保存一个标识符，在change回调函数中通过标识符判断情况 问题2：内部input的值无法修改，应该是和组件内部数据做了双向绑定解决思路：并非是做了双向绑定，而是需要延后设值 最后贴上代码： <template> <el-date-picker v-model="hValue" @change="handleChange"></el-date-picker> </template> <script> export default { data() { return { hValue: "", clickOutsideFlag: false, childHandleClose: null }; }, props: { value: { type: [Date, String, Array], required: true } }, created() { this.$nextTick(() => { this.childHandleClose = this.$refs.datePicker.handleClose; this.$refs.datePicker.handleClose = this.handleClose; }); }, watch: { value(val) { this.hValue = val; this.updateInput(); }, hValue(val) { if (val === null) { this.hValue = ""; } this.updateInput(); } }, methods: { handleChange() { if (!this.clickOutsideFlag) { this.updateInput(); this.$emit("input", this.hValue); this.$emit("change", this.hValue); } else { this.clickOutsideFlag = false; this.hValue = this.value; } }, handleClose() { if (this.$refs.datePicker.pickerVisible) { this.clickOutsideFlag = true; this.childHandleClose(); } }, updateInput() { this.$nextTick(() => { this.$refs.datePicker.$refs.reference.$refs.input.value = this.value; }); } } }; </script>