ivew 时间选择默认当前时间 日期选择器默认当前日期 请给我一个例子

好的，以下是一个基于 Vue.js 和 Element UI 的时间选择器和日期选择器的例子：

<template>
  <div>
    <!-- 时间选择器 -->
    <el-date-picker
      v-model="time"
      type="time"
      :picker-options="timePickerOptions"
    ></el-date-picker>

    <!-- 日期选择器 -->
    <el-date-picker
      v-model="date"
      type="date"
      :picker-options="datePickerOptions"
    ></el-date-picker>
  </div>
</template>

<script>
export default {
  data() {
    return {
      time: '', // 当前时间
      date: '', // 当前日期
      timePickerOptions: {
        start: '00:00', // 可选开始时间
        end: '23:59', // 可选结束时间
        step: '00:30', // 时间间隔
        format: 'HH:mm', // 显示格式
        selectableRange: '00:00:00-23:59:59', // 可选时间范围
        value: new Date(), // 默认当前时间
      },
      datePickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now(); // 禁用未来日期
        },
        format: 'yyyy-MM-dd', // 显示格式
        value: new Date(), // 默认当前日期
      },
    };
  },
};
</script>

在这个例子中，我们使用了 Element UI 的 `el-date-picker` 组件来创建时间选择器和日期选择器，通过设置相应的 `type` 属性来指定选择器的类型。我们也可以通过 `picker-options` 属性来设置选择器的选项，包括可选的时间范围、时间间隔、显示格式等。在这个例子中，我们设置了时间选择器的默认时间为当前时间，日期选择器的默认日期为当前日期。