vue3+ts vant中的calendar怎样设置选择今天之前的所有日期并且今天之后的日期只读状态

你可以使用 `disabled-date` 属性来实现这个功能。具体实现方法如下：

1. 在模板中添加 `van-calendar` 组件，并设置 `disabled-date` 和 `readonly` 属性：

<template>
  <van-calendar
    v-model="date"
    :min-date="minDate"
    :max-date="maxDate"
    :readonly="isReadonly"
    :disabled-date="disabledDate"
  />
</template>

2. 在 `data` 中定义 `date`、`minDate`、`maxDate` 和 `isReadonly` 变量：

<script lang="ts">
import { defineComponent } from 'vue';
import { Calendar } from 'vant';

export default defineComponent({
  components: {
    [Calendar.name]: Calendar,
  },
  data() {
    return {
      date: new Date(),
      minDate: new Date(),
      maxDate: new Date(new Date().getFullYear() + 1, 11, 31),
      isReadonly: false,
    };
  },
  methods: {
    disabledDate(date: Date) {
      const today = new Date();
      return date.getTime() < this.minDate.getTime() || date.getTime() > today.getTime();
    },
  },
});
</script>

3. 在 `methods` 中定义 `disabledDate` 方法，判断日期是否在今天之前或者最小日期之前：

methods: {
  disabledDate(date: Date) {
    const today = new Date();
    return date.getTime() < this.minDate.getTime() || date.getTime() > today.getTime();
  },
},

这样，就可以实现选择今天之前的所有日期，并且今天之后的日期只读状态。