@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
45 lines (44 loc) • 2.72 kB
TypeScript
/**
* Time Picker 组件用来选择时间。
*
* @example
* ```tsx
* import { defineComponent, ref, watch } from 'vue';
* import { FTimePicker } from '../../components/time-picker';
*
* export default defineComponent({
* name: 'BasicTsxDemo',
* setup() {
*
* const emptyValue = ref('')
* const defaultValue = ref('15:08:16')
* const placeholder='请输入开始时间'
*
* return () => (
* <>
* <div class="f-form-layout farris-form farris-form-controls-inline f-form-label-xl farris-form-auto"><b>基础用法</b>
* <div class="col-12"><div class="farris-group-wrap"><div class="form-group farris-form-group"><label class="col-form-label"><span class="farris-label-emptyValue">初始值为空</span></label>
* <div class="farris-input-wrap"><FTimePicker modelValue={emptyValue.value} onUpdate:modelValue={(v: any) => { emptyValue.value = v; }} /></div></div></div></div>
* <div class="col-12"><div class="farris-group-wrap"><div class="form-group farris-form-group"><label class="col-form-label"><span class="farris-label-emptyValue">有初始值</span></label>
* <div class="farris-input-wrap"><FTimePicker modelValue={defaultValue.value} onUpdate:modelValue={(v: any) => { defaultValue.value = v; }} /></div></div></div></div>
* <b>设置placeholder</b>
* <div class="col-12"><div class="farris-group-wrap"><div class="form-group farris-form-group"><label class="col-form-label"><span class="farris-label-emptyValue">初始值为空</span></label>
* <div class="farris-input-wrap"><FTimePicker modelValue={emptyValue.value} onUpdate:modelValue={(v: any) => { emptyValue.value = v; }} placeholder={placeholder} /></div></div></div></div>
* <div class="col-12"><div class="farris-group-wrap"><div class="form-group farris-form-group"><label class="col-form-label"><span class="farris-label-emptyValue">有初始值</span></label>
* <div class="farris-input-wrap"><FTimePicker modelValue={defaultValue.value} onUpdate:modelValue={(v: any) => { defaultValue.value = v; }} placeholder={placeholder} /></div></div></div></div></div>
* </>
* );
* }
* });
* ```
*
* @public
*/
declare const _default: import("vue").DefineComponent<{
[x: string]: any;
}, () => any, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
[x: string]: any;
}> & Readonly<{}>, {
[x: string]: any;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
export default _default;