在 if 语句内找不到变量名

Question

运行 graphql 查询后，我将结果中的一些值提取到一个对象中，并在我的平面列表中使用它。

const DATA = data.users.nodes[0].userRelations.map(
(item: { relatedUser: { firstName: string; id: number } }) => ({
id: item.relatedUser.id,
imageUrl: defaultUrl,
name: item.relatedUser.firstName,
}),
);

这行得通。但是，当我将其更改为如下所示时：

const { error, data, refetch } = useUsersQuery({
variables: {
where: { id: 1 },
},
});
if (data) {
const DATA = data.users.nodes[0].userRelations.map(
(item: { relatedUser: { firstName: string; id: number } }) => ({
id: item.relatedUser.id,
imageUrl: defaultUrl,
name: item.relatedUser.firstName,
}),
);
} else {
const DATA = [
{
id: 'bd7acbea-c1b1-46c2-aed5-3ad53abb28ba',
imageUrl: defaultUrl,
name: 'Johann',
},
{
id: '3ac68afc-c605-48d3-a4f8-fbd91aa97f63',
imageUrl: defaultUrl,
name: 'Lars',
},
{
id: '58694a0f-3da1-471f-bd96-145571e29d72',
imageUrl: defaultUrl,
name: 'Sarah',
},
];
}

...
<FlatList
data={DATA}
horizontal={true}
scrollEnabled
renderItem={({ item }) => (
<WhitelistItem title={item.name} face={item.imageUrl} />
)}
keyExtractor={(item) => item.id}
/>

我开始在这里收到错误data={DATA}那个Cannot find name 'DATA'. Did you mean 'data'?.为什么会这样？即使查询失败，我仍然在 else 语句中创建一个DATA变量。那么为什么这里没有被发现呢？我该如何解决这个问题？

Answer 1

let DATA;
if (data) {
DATA = data.users.nodes[0].userRelations.map(
(item: { relatedUser: { firstName: string; id: number } }) => ({
id: item.relatedUser.id,
imageUrl: defaultUrl,
name: item.relatedUser.firstName,
}),
);
} else {
DATA = [
{
id: 'bd7acbea-c1b1-46c2-aed5-3ad53abb28ba',
imageUrl: defaultUrl,
name: 'Johann',
},
{
id: '3ac68afc-c605-48d3-a4f8-fbd91aa97f63',
imageUrl: defaultUrl,
name: 'Lars',
},
{
id: '58694a0f-3da1-471f-bd96-145571e29d72',
imageUrl: defaultUrl,
name: 'Sarah',
},
];
}

let和const是块作用域，这意味着它们不是在声明它们的块(大括号(之外定义的。当你在if/else中声明DATA时，它只在里面声明。