关于交叉类型的控制台报错

Question

请问老师，我直接将提交中的代码拷贝到ide中，控制台报截图中的问题，我不理解为什么会出现，麻烦解答下，谢谢

Answer 1

张轩 2020-04-06 09:47:42

同学你好 这个代码在这个章节确实有一些小问题 但是当时编辑器没有报错 故没有发现，最后提交的代码已经修复了这个 bug，因为我们在 renderOption 这个函数中item的类型， DataSourceType<LakerPlayerProps> 和 DataSourceType 是不一样的，所以会报这个错误，我们可以使用类型断言解决这个问题。 函数稍微修改一下。

const renderOption = (item: DataSourceType) => {
    const itemWithNumber = item as DataSourceType<LakerPlayerProps>
    return (
    <>
        <b>名字: {itemWithNumber.value}</b>
        <span>球衣号码: {itemWithNumber.number}</span>
    </>
    )
}

谢谢你认真代码后的发现。

• 提问者 猪猪oO #1

  非常感谢！谢谢老师

• Shiyu_2020 #2

  老师， 如果代码写成export type DataSourceType<T=any> = T & DataSourceObject, 这种写法会产生不可预知bug吗？泛型为any的话， 什么interface都能够传进来。

Answer 2

pino宋 2020-04-15 02:55:30

interface LakerPlayerProps{

value:string;

number?:number;

}

这样好像也可以