element-plus/docs/examples/time-picker/range.vue
2022-03-13 16:16:11 -04:00

37 lines
757 B
Vue

<template>
<div class="demo-range">
<el-time-picker
v-model="value1"
is-range
range-separator="To"
start-placeholder="Start time"
end-placeholder="End time"
/>
<el-time-picker
v-model="value2"
is-range
arrow-control
range-separator="To"
start-placeholder="Start time"
end-placeholder="End time"
/>
</div>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
const value1 = ref([new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)])
const value2 = ref([new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)])
</script>
<style>
.demo-range .el-date-editor {
margin: 8px;
}
.demo-range .el-range-separator {
box-sizing: content-box;
}
</style>