背景：此时，组件内部的状态值是“response”|'header'，但是在组件内部，我们需要在不同的组件之间进行切换，这时候就需要用到类型切换。现实思路：第一种现实函数App(){const[type,setType]=useState<"respones"|“标题”>（“响应”）；返回(
{[{name:'response',},{name:'header',}].map((item)=>{return{item.name}})}{type==='response'?
)}总结：以上两种方法都可以达到我们的目的，但是第二种方法更灵活，因为我们可以通过循环来实现，而不是硬编码两个按钮。第一种方法的实现，如果我们需要添加一个新的类型，那么我们需要在组件内部添加一个新的按钮，这样会降低组件的可维护性。另外，第一种方法中的函数组件的渲染次数会比第二种方法中的函数组件多，因为第一种方法中的函数组件每次渲染都会重新创建一个新的函数，而第二种方法中的函数组件将重新创建一个新函数。两种方法的函数组件在每次渲染时都会使用同一个函数。