Question

我在Vue.js中使用ElementUI。

我想做的是仅在选择器的弹出器关闭时使用el-date-picker并监听输入的更新（因此，通过鼠标单击/直接文本编辑或通过键盘箭头控件选择日期时，可以进行更早的更新）不会触发我的“特殊”更新）-是否可以轻松实现？我当时在考虑使用自定义popper类，但不确定如何监听close事件来检测它。

Answer 1

您可以通过blur事件来实现自己想要的目标：https://element.eleme.io/#/en-US/component/date-picker#events

如果您想玩的话，这里是Codepen。如果您只想运行它，这是代码：

var Main = {
    methods: {
      blur () {
        console.log('hey')
      }
    },
    data() {
      return {
        value1: ''
      };
    }
  };
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')

@import url("//unpkg.com/element-ui@2.8.2/lib/theme-chalk/index.css");

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/element-ui@2.8.2/lib/index.js"></script>
<div id="app">
<template>
  <div class="block">
    <span class="demonstration">Default</span>
    <el-date-picker
      v-model="value1"
      type="date"
      @blur="blur"
      placeholder="Pick a day">
    </el-date-picker>
  </div>
</template>
</div>

Popper关闭时的ElementUI日期时间选择器更新

1 个答案: