vueelementui 日期选择器

Vue ElementUI日期选择器是一个可用于选择日期的组件。根据需求，你想要实现默认选中近一个月的日期，并且只能选择今天到三年前的日期，今天以后的日期不可选。为了解决报400错误，你需要对日期进行格式化处理。

你可以通过设置日期选择器的默认值来实现默认选中近一个月的日期，可以使用moment.js库来方便地进行日期计算和格式化。具体的实现步骤如下：

1. 首先，安装moment.js库。使用npm命令进行安装：

   npm install moment --save

2. 在Vue组件中导入moment.js库：

   import moment from "moment";

3. 在日期选择器的v-model绑定的数据中设置默认值。你可以使用moment.js库的方法来计算近一个月之前的日期，并将其作为v-model的初始值：

   <el-date-picker v-model="selectedDate" :default-value="getDefaultDate()" :disabled-date="disabledDate"></el-date-picker>

4. 在Vue组件中定义getDefaultDate方法来计算近一个月之前的日期，并将其返回：

   methods: {
     getDefaultDate() {
       return moment().subtract(1, 'month').format('YYYY-MM-DD');
     },
     disabledDate(time) {
       // 在这里可以根据你的需求设置日期的不可选范围
       return time.getTime() > new Date().getTime() || time.getTime() < moment().subtract(3, 'year').toDate().getTime();
     },
   },

通过以上步骤，你可以实现默认选中近一个月的日期，并且只能选择今天到三年前的日期，今天以后的日期将不可选。同时，你也解决了报400错误，对日期进行了格式化处理，确保前后端数据格式匹配。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [vue使用elementUI中日期选择器](https://blog.csdn.net/weixin_48927323/article/details/128186565)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *2* [解决vue elementUI 日期选择器提交springboot后端数据时报400错误](https://blog.csdn.net/Ppphill_C/article/details/118034550)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"]
- *3* [vue elementui 范围选择周、季、年时间控件替换包.zip](https://download.csdn.net/download/qq_39019765/44321511)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"]
[ .reference_list ]