# lfj-time-picker

**Repository Path**: li-feijie1/lfj-time-picker

## Basic Information

- **Project Name**: lfj-time-picker
- **Description**: uniapp 时间选择器组件
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-12-02
- **Last Updated**: 2025-12-10

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

📅 lfj-time-picker (时间选择器)

## 功能简介
`lfj-time-picker` 是一个用于选择时间的组件，适用于 UniApp 项目。它提供了一个用户友好的界面，让用户可以轻松地选择时间。

## 使用方式

### 基础用法
要使用 `lfj-time-picker` 组件，首先需要在您的项目中安装并引入它。然后，您可以在页面中使用以下代码来展示时间选择器：

```vue
<template>
  <view>
    <lfj-time-picker v-model="selectedTime" />
    <p>选中的时间: {{ selectedTime }}</p>
  </view>
</template>

<script>
import LfjTimePicker from '@/uni_modules/lfj-time-picker/components/lfj-time-picker/lfj-time-picker.vue';

export default {
  components: {
    LfjTimePicker
  },
  data() {
    return {
      selectedTime: ''
    };
  }
};
</script>
```

### 自定义显示字段（mode属性）
您可以使用 `mode` 属性来控制时间选择器的显示模式。例如，仅选择小时和分钟：

```vue
<template>
  <view>
    <lfj-time-picker v-model="selectedTime" mode="time" />
    <p>选中的时间: {{ selectedTime }}</p>
  </view>
</template>
```

## Props 说明
| 属性名 | 类型 | 默认值 | 描述 |
|-------|------|-------|------|
| v-model | String | '' | 绑定的时间值 |
| mode | String | 'datetime' | 选择器模式，可选值：'datetime', 'date', 'time' |
| disabled | Boolean | false | 是否禁用选择器 |
| placeholder | String | '请选择时间' | 未选择时的占位符 |

## 事件说明
- `change`: 当时间发生变化时触发的事件。

## 格式说明
时间格式遵循 ISO 8601 标准，例如 `2023-10-01T12:00:00`。

## 使用建议
- 确保在页面加载时初始化 `v-model` 绑定的时间值。
- 使用 `placeholder` 属性提供清晰的提示信息。

## 开发者提示
- 如果您遇到任何问题，可以查看 `uni_modules/lfj-time-picker` 目录下的 `readme.md` 文件以获取更多信息。
- 您可以在 `uni_modules/lfj-time-picker/components/lfj-time-picker/lfj-time-picker.vue` 文件中自定义组件样式和功能。

## 示例项目
请参考本项目的 `pages/index/index.vue` 文件以查看完整的使用示例。