Bootstrap Vue datepicker 道具最大值失败，预期字符串，日期，得到日期答案

【问题标题】：Bootstrap Vue datepicker failed for prop max, expected String, Date, got DateBootstrap Vue datepicker 道具最大值失败，预期字符串，日期，得到日期
【发布时间】：2020-09-21 00:43:07
【问题描述】：

我正在使用 Bootstrap Vue，尤其是 formdatepicker。它看起来像这样：

<b-form-datepicker
  v-model="user.birthdate"
  class="mb-2"
  :max="maxBirthdate"
  :placeholder="$t('birthdate_field_placeholder')"
  :show-decade-nav="true"
/>

我想将最大日期限制为从今天开始的 16 年前。所以我使用这个代码：

created () {
    let now = new Date()
    let today = new Date(now.getFullYear(), now.getMonth(), now.getDate())
    let todayMinusSixteenYears = new Date(today)
    todayMinusSixteenYears.setFullYear(todayMinusSixteenYears.getFullYear() - 16)
    this.maxBirthdate = todayMinusSixteenYears
  },

当我启动我的 Nuxt 应用程序时，我收到以下错误：

[Vue warn]: Invalid prop: type check failed for prop "max". Expected String, Date, got Date 

found in

---> <BCalendar>
       <BVFormBtnLabelControl>
         <BFormDatepicker>
           <Anonymous>
             <BFormGroup>
               <FormControlWrapper> at components/form/FormControlWrapper.vue
                 <ValidationObserver>
                   <Pages/register/volunteer.vue> at pages/register/volunteer.vue
                     <Nuxt>
                       <Layouts/default.vue> at layouts/default.vue
                         <Root>

我不确定错误在哪里或是什么，因为该变量绝对是 Javascript 日期。当试图把 .toString() 放在最后时，它根本不起作用。

请注意，即使应用程序给出了如图所示的错误，它也可以与 Javascript Date 对象完美配合。

【问题讨论】：

标签： vue.js bootstrap-vue

【解决方案1】：

如果没有完整的脚本（尤其是 data 对象），我无法说出您的问题的根源是什么，但是从 Bootstrap Vue 演示开始，下面的代码可以工作。您可能遇到的是 created 函数与 data 中的任何内容之间的冲突

<script>
  export default {
    data() {
      let now = new Date()
      let today = new Date(now.getFullYear(), now.getMonth(), now.getDate())
      let todayMinusSixteenYears = new Date(today)
      todayMinusSixteenYears.setFullYear(todayMinusSixteenYears.getFullYear() - 16)

      return {
        value: '',
        maxBirthdate: todayMinusSixteenYears,
      }
    }
  }
</script>

【讨论】：