vue3使用el-date-picker获取日期

在 Vue3 中使用 Element UI 的 `el-date-picker` 组件来获取日期通常涉及到数据绑定和事件监听。首先，你需要在模板上声明组件，并将选中的日期绑定到一个数据属性上。下面是一个简单的例子：

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

<script setup>
import { ref } from 'vue';

// 创建一个响应式的变量来存储选中的日期
const selectedDate = ref(null);

// 当用户从日期选择器选择日期后，这个值会自动更新
onMounted(() => {
  // 如果你想获取当前日期，可以使用 Date 对象
  selectedDate.value = new Date();
});

// 用户可能会通过 API 或其他外部操作改变日期
function setDate(date) {
  selectedDate.value = date;
}

export default {
  data() {
    return {
      selectedDate,
    };
  },
  methods: {
    setDate,
  },
};
</script>

当你需要获取 `selectedDate` 的值时，可以直接访问它。例如，在提交表单之前，你可以这样做：

const onSubmit = () => {
  const chosenDate = selectedDate.value; // 这里就是用户选择的日期
  console.log(chosenDate);
};