元素 - 没有输入的 DatePicker

编程问答 2022-11-24

问题描述

我正在尝试直接在我的 Vue 页面中显示 Element Datepicker 组件，而不必显示并单击输入元素以使其弹出。我在 Github 上阅读了他们的 source code，没有这方面的支持，我不想在 node_modules 的项目中修改它，因为我知道这是不好的做法。

我尝试将点击事件创建的 div 直接附加到我的 vue 中，但它不起作用，我无法跟踪和检索我的输入数据到我的 Vuejs 状态。

这是Datepicker输入点击事件创建的div的截图：

enter image description here

如果有人知道如何实现这一目标，那就太棒了。

解决方法

您可以使用 ref 调用选择器组件上的函数

<el-date-picker
      ref="test"
      v-model="value1"
      type="date"
      placeholder="Pick a day">
</el-date-picker>

JS

mounted() {
  this.$refs.test.showPicker()
},

还在codepen上添加了一个例子：https://codepen.io/reijnemans/pen/ExmvGLa

datepickerdatepickerelementelementjavascriptvue.js