You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
63 lines
1.3 KiB
63 lines
1.3 KiB
<docs>
|
|
---
|
|
order: 1
|
|
title:
|
|
zh-CN: 附加内容
|
|
en-US: Addon
|
|
---
|
|
|
|
## zh-CN
|
|
|
|
在 TimePicker 选择框底部显示自定义的内容。
|
|
|
|
## en-US
|
|
|
|
Render addon contents to timepicker panel's bottom.
|
|
|
|
</docs>
|
|
|
|
<template>
|
|
<a-space direction="vertical">
|
|
<a-time-picker v-model:value="value" v-model:open="open" @openChange="handleOpenChange">
|
|
<template #renderExtraFooter="{ prefixCls }">
|
|
<a-button size="small" type="primary" @click="handleClose">OK {{ prefixCls }}</a-button>
|
|
</template>
|
|
</a-time-picker>
|
|
<a-time-picker v-model:value="value" v-model:open="open2">
|
|
<template #renderExtraFooter>
|
|
<a-button size="small" type="primary" @click="handleClose">OK</a-button>
|
|
</template>
|
|
</a-time-picker>
|
|
</a-space>
|
|
</template>
|
|
<script lang="ts">
|
|
import { Dayjs } from 'dayjs';
|
|
import { defineComponent, ref } from 'vue';
|
|
|
|
export default defineComponent({
|
|
setup() {
|
|
const open = ref(false);
|
|
const open2 = ref(false);
|
|
const value = ref<Dayjs>();
|
|
|
|
const handleOpenChange = (openStatus: boolean) => {
|
|
console.log('open', openStatus);
|
|
open.value = openStatus;
|
|
};
|
|
|
|
const handleClose = () => {
|
|
open.value = false;
|
|
open2.value = false;
|
|
};
|
|
|
|
return {
|
|
value,
|
|
open,
|
|
open2,
|
|
handleOpenChange,
|
|
handleClose,
|
|
};
|
|
},
|
|
});
|
|
</script>
|