el-date-picker 选中获取值

在使用 Element UI（一个基于 Vue 2.x 的桌面端组件库）中的 el-date-picker 组件时，如果你想要获取用户选中的日期值，可以采用以下几种方法之一：

1. 使用 v-model

最简单的方式是通过双向数据绑定 v-model 将输入框的值与 Vue 实例中的某个数据属性绑定起来。当用户选择了日期后，这个数据属性就会自动更新为所选的日期。

<template>
  <el-date-picker
    v-model="date"
    type="date"
    placeholder="选择日期">
  </el-date-picker>
</template>

<script>
export default {
  data() {
    return {
      date: ''
    };
  }
};
</script>

在这个例子中，date 数据属性将会存储用户选择的日期。

2. 监听 change 事件

如果你需要在日期改变时执行某些操作，可以通过监听 el-date-picker 的 change 事件来实现。

<template>
  <el-date-picker
    v-model="date"
    type="date"
    placeholder="选择日期"
    @change="handleDateChange">
  </el-date-picker>
</template>

<script>
export default {
  data() {
    return {
      date: ''
    };
  },
  methods: {
    handleDateChange(value, dateString) {
      console.log('Selected date:', value);
      console.log('Formatted date string:', dateString);
    }
  }
};
</script>

这里，handleDateChange 方法会在每次日期选择改变时被调用，并且会接收到两个参数：一个是用户选择的日期对象 value，另一个是格式化后的日期字符串 dateString。

注意事项

• 如果你使用的是 Vue 3，那么 Element UI 可能不会直接支持 Vue 3，你需要查找 Element Plus 或其他兼容 Vue 3 的 UI 库来实现类似的功能。
• 确保你的 Vue 和 Element UI 版本是兼容的，并且已经正确安装和引入了相关组件。

以上就是在 Element UI 中使用 el-date-picker 并获取所选日期的方法。如果你有任何具体的问题或者需要进一步的帮助，请随时提问！