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

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (282)

我正在使用带有Vue.js的ElementUI。

我想要做的是el-date-picker仅在选择器的popper关闭时使用和监听输入的更新(因此通过鼠标单击/直接文本编辑或通过键盘箭头控件选择日期时的早期更新不会触发我的'特殊'更新) - 它是否容易实现?我在考虑使用自定义popper类,但不确定如何监听close事件来检测它。

提问于
用户回答回答于

您可以通过该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>

扫码关注云+社区

领取腾讯云代金券