el-date-picker 选择范围两天
时间: 2023-09-25 11:16:30 浏览: 46
datepicker 前端时间范围选择
要使 el-date-picker 选择两天的范围,您可以使用其 range 属性。该属性接受一个布尔值(true 或 false)以指示是否启用日期范围选择。如果启用,则需要使用另外两个属性:start-placeholder 和 end-placeholder,它们分别指定选择范围的起始日期和结束日期的占位符文本。
以下是一个示例代码:
```html
<el-date-picker
range
start-placeholder="开始日期"
end-placeholder="结束日期"
v-model="dateRange"
></el-date-picker>
```
在上面的示例中,我们将 range 属性设置为 true,并使用 start-placeholder 和 end-placeholder 属性来设置占位符文本。我们还使用了 v-model 指令将选择的日期范围绑定到一个名为 dateRange 的变量上。您可以在组件的 methods 中添加一个名为 handleDateChange 的方法来处理日期选择更改事件:
```javascript
methods: {
handleDateChange(value) {
console.log(value); // 输出选定的日期范围
}
}
```
您可以在上面的方法中执行任何适当的操作,例如将选定的日期范围发送到服务器或在页面上显示它们。
阅读全文