diff --git a/packages/cell/index.tsx b/packages/cell/index.tsx index fa9245dc8..2b43d2ce5 100644 --- a/packages/cell/index.tsx +++ b/packages/cell/index.tsx @@ -22,6 +22,10 @@ export type CellSlots = DefaultSlots & { 'right-icon'?: ScopedSlot; }; +export type CellEvents = { + onClick(event: Event): void; +}; + const [sfc, bem] = use('cell'); function Cell( @@ -102,4 +106,4 @@ Cell.props = { arrowDirection: String }; -export default sfc(Cell); +export default sfc(Cell); diff --git a/packages/contact-card/index.js b/packages/contact-card/index.tsx similarity index 65% rename from packages/contact-card/index.js rename to packages/contact-card/index.tsx index 1a1ff5569..d773e749f 100644 --- a/packages/contact-card/index.js +++ b/packages/contact-card/index.tsx @@ -2,9 +2,26 @@ import { use } from '../utils'; import { emit, inherit } from '../utils/functional'; import Cell from '../cell'; +// Types +import { CreateElement, RenderContext } from 'vue/types'; +import { DefaultSlots } from '../utils/use/sfc'; + const [sfc, bem, t] = use('contact-card'); -function ContactCard(h, props, slots, ctx) { +export type ContactCardProps = { + tel?: string; + name?: string; + type?: string; + addText?: string; + editable?: boolean; +}; + +function ContactCard( + h: CreateElement, + props: ContactCardProps, + slots: DefaultSlots, + ctx: RenderContext +) { const { type, editable } = props; return ( @@ -15,7 +32,7 @@ function ContactCard(h, props, slots, ctx) { class={bem([type])} valueClass={bem('value')} icon={type === 'edit' ? 'contact' : 'add-square'} - onClick={event => { + onClick={(event: Event) => { if (editable) { emit(ctx, 'click', event); } @@ -46,4 +63,4 @@ ContactCard.props = { } }; -export default sfc(ContactCard); +export default sfc(ContactCard); diff --git a/packages/utils/use/sfc.ts b/packages/utils/use/sfc.ts index db426064a..9d13a2780 100644 --- a/packages/utils/use/sfc.ts +++ b/packages/utils/use/sfc.ts @@ -35,6 +35,8 @@ export interface VantComponentOptions extends ComponentOptions { export type DefaultProps = Record; +export type DefaultEvents = {}; + export type FunctionalComponent< Props = DefaultProps, PropDefs = PropsDefinition @@ -54,7 +56,9 @@ export type TsxBaseProps = { class?: any; style?: any; }; -export type TsxComponent = (props: T & TsxBaseProps) => VNode; +export type TsxComponent = ( + props: Props & Events & TsxBaseProps +) => VNode; const arrayProp = { type: Array, @@ -110,9 +114,9 @@ function transformFunctionalComponent( }; } -export default (name: string) => ( +export default (name: string) => ( sfc: VantComponentOptions | FunctionalComponent -): TsxComponent => { +): TsxComponent => { if (typeof sfc === 'function') { sfc = transformFunctionalComponent(sfc); } @@ -129,5 +133,5 @@ export default (name: string) => ( sfc.name = name; sfc.install = install; - return sfc as TsxComponent; + return sfc as TsxComponent; };