46 lines
943 B
TypeScript
46 lines
943 B
TypeScript
import { Component, Prop, TSX, Vue } from 'vue-facing-decorator'
|
|
|
|
interface Props {
|
|
text?: string
|
|
list?: ListItemType[]
|
|
}
|
|
|
|
interface ListItemType {
|
|
id: number
|
|
title: string
|
|
}
|
|
|
|
@Component()
|
|
export default class Header extends TSX<Props>()(Vue) implements Props {
|
|
|
|
@Prop({ default: '默认数值' })
|
|
text!: string;
|
|
|
|
@Prop()
|
|
list!: ListItemType[];
|
|
|
|
created() {
|
|
console.log("created: ", this)
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div class="header">
|
|
头部组件
|
|
<p>{ this.text }</p>
|
|
{ this.$slots.default?.() }
|
|
{ this.$slots.haveName?.() }
|
|
<ul>
|
|
{
|
|
this.list.map(
|
|
item =>
|
|
this.$slots.item?.(item)
|
|
)
|
|
}
|
|
</ul>
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
|