typescript 类型兼容问题

Question

interface Select {
    lable:string,    value:string[] 
}interface Input {
    lable: string
    value :string}const arr =[
    {
        lable: "select",        value:['boy', 'gril']
    },
    {
        lable: 'input',        value: 'this is a input'
    }
];


arr.forEach((item: Select | Input) => {  
    if (item.lable =='input') {
        reciverInputProps(item.value)
    }else {
        reciverSelectProps(item.value)
    }
    
})function reciverInputProps(value: string) {

}function reciverSelectProps(value: []) {

}

现在我定义了两个interface,他们之间的value类型不一样，一个是string，另一个是数组但是我需要在forEach里面根据lable的类型分别传值另外两个函数，这两个函数的参数类型不一样，编辑器会提示报错，有什么办法兼容不同的类型吗

Answer 1

可以在声明时使用：value: string|string[]，比如function reciverSelectProps(value: string|string[]) {}你也可以在接口中这样声明：interface Input {lable: string; value :string|string[];}在使用的时候先判断value的类型if (value instanceof string[]){let v:string[]=value as string[];}就你问的报错问题，必须先明确item的类型，这样就不会报错:arr.forEach((item: Select | Input) => {if (item.lable =='input') {    let vi:Input=item as Input;     reciverInputProps(vi.value) }else {    let si:Input=item as Select;     reciverSelectProps(si.value) }})

Answer 2

interface Select {     lable: 'select',     value: string[] }interface Input {     lable: 'input',     value: string}const arr = [     {         lable: "select",         value: ['boy', 'gril']     },     {         lable: 'input',         value: 'this is a input'     } ]; arr.forEach((item: Select | Input) => {    if (item.lable == 'input') {         reciverInputProps(item.value)     } else {         reciverSelectProps(item.value)     } })function reciverInputProps(value: string) { }function reciverSelectProps(value: string[]) { }