更新记录

1.0.0（2025-01-04） 下载此版本

日期周选择

平台兼容性

jia-weekPicker 周选择器组件

一个用于选择指定年月中某一周的 uni-app 组件。支持设置可选日期范围、自定义主题色等功能。

特性

• 按周选择日期
• 支持自定义可选日期范围
• 自定义主题色
• 流畅的切换动画
• 周一作为每周的第一天
• 支持自定义标题和按钮文本

安装方法

在 uni-app 插件市场中搜索 jia-weekPicker 并导入到项目中。

基础用法

<template>
  <view>
    <button @click="openPicker">打开周选择器</button>
    <jia-weekPicker
      ref="weekPicker"
      :value="selectedDate"
      @change="handleWeekChange"
    />
  </view>
</template>
<script>
export default {
  data() {
    return {
      selectedDate: "2024-03-18", // 默认选中日期
    };
  },
  methods: {
    openPicker() {
      this.$refs.weekPicker.open();
    },
    handleWeekChange(week) {
      console.log("选中的周:", week);
      // week 结构如下：
      // {
      // startDate: '2024-03-18', // 周开始日期
      // endDate: '2024-03-24', // 周结束日期
      // timestamp: 1711209600000, // 结束日期的时间戳
      // weekNumber: 3 // 当月第几周
      // }
    },
  },
};
</script>

API

Props

Events

Methods

week 对象结构

startDate: String, // 周开始日期，格式：YYYY-MM-DD
endDate: String, // 周结束日期，格式：YYYY-MM-DD
timestamp: Number, // 结束日期的时间戳
weekNumber: Number // 当月第几周

注意事项

1. 日期格式必须为 'YYYY-MM-DD'
2. minDate 不能大于 maxDate
3. 每周默认以周一为开始日
4. 组件需要通过 ref 调用 open 方法来显示