Javascript 如何在函数组件中使用typeScript进行类型限制和默认值

我有一个类似于componet的函数示例，我知道如何使用PropTypes来设置道具的类型并给它们默认值，但我的团队使用的是typescript，所以我必须知道如何使用typescript来获得这个结果，我尝试搜索答案，但我没有得到确切的答案，有人知道怎么做吗

例如：

const List = ({title,showTitle,buttonText,onClickButton,itemText}) =>
  <div>
    { showTitle &&
      <Typography
        variant="body1"
        color="textSecondary"
        align="left"
      >
        {title}
      </Typography>
    }
    <ListItem button={false}>
      <ListItemIcon>
        <IconVideocam />
      </ListItemIcon>
      <ListItemText primary={itemText} />
      <ListItemIcon>
        <Button
          id={"Button"}
          onClick={onClickButton}
          color="primary"
        >
          { buttonText }
        </Button>
      </ListItemIcon>
    </ListItem>
  </div>

export default List 

const List=（{title，showttitle，buttonText，onClickButton，itemText}）=>
{showTitle&&
{title}
}
{buttonText}
导出默认列表

您可以使用

React.SFC

类型断言无状态React组件的props，如下所示：

// Props.
interface Props {
  buttonText: string  
  itemText: string
  showTitle: boolean
  onClickButton: () => void
  title: string
}

// List.
const List: React.SFC<Props> = props => <div> .. </div> 

//道具。
界面道具{
buttonText:字符串
itemText:string
展品名称：布尔
onClickButton:（）=>void
标题：字符串
}
//名单。
常数列表：React.SFC=props=>。。