大佬教程收集整理的这篇文章主要介绍了TypeScript 问题，大小写切换返回意外类型，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
谁能给我解释一下（见代码部分的评论）？
playground link
interface Payloadnumber {
key: "A";
data: number;
}
interface PayloadString {
key: "B";
data: String;
}
interface updateStateAction {
payload: Payloadnumber | PayloadString;
}
const whatever = (action: updateStateAction): number => {
const { key } = action.payload;
switch (key) {
case "A":
return action.payload.data; // Why is this String | number and not number? ?
default:
return 1;
}
};
问题是解构
const { key } = action.payload;
// or even
const key = action.payload.key;
我们正在 key 中隔离 Payloadnumber | PayloadString。
由于我们只查看 key，因此打字稿可以做出的唯一推断是 key 是 "A" 还是 "B"。
Typescript 不可能对 action.payload.data 进行推断，因为它不知道您正在尝试通过 key 确定它的类型。
你可以做两件事，要么
const whatever = (action: updateStateAction): number => {
switch (action.payload.key) {
case 'A':
return action.payload.data;
default:
return 1;
}
};
或
const whatever = (action: updateStateAction): number => {
const p = action.payload;
switch (p.key) {
case 'A':
return p.data;
default:
return 1;
}
};
您会看到 action.payload.data 现在输入正确。您可以看到，在这两种情况下，我们都引用了整个 payload 类型，而不仅仅是 key 中的 payload。
以上是大佬教程为你收集整理的TypeScript 问题，大小写切换返回意外类型全部内容，希望文章能够帮你解决TypeScript 问题，大小写切换返回意外类型所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。