分配前使用的打字稿变量

Posted 2023-03-10

【中文标题】分配前使用的打字稿变量

【英文标题】：Typescript variable being used before assigned

【发布时间】：2020-05-22 20:28:24

【问题描述】：

按照here 的说明，我正在尝试在构建我的 Apollo 客户端之前缓存来自 Auth0 的端点 URL 和令牌：

import React from 'react';
import  ApolloClient, ApolloProvider, from, HttpLink, InMemoryCache  from '@apollo/client';
import  setContext  from '@apollo/link-context';
import  useAuth0  from './auth/AuthContext';

const App: React.FC = () => 
	const  isLoading, getTokenSilently, getIdTokenClaims  = useAuth0();

	if (isLoading) return <Loader />;

	let endpoint: string;
	let token: string;
	const contextLink = setContext(async () => 
		if (!token) 
			token = await getTokenSilently();
		
		if (!endpoint) 
			endpoint = await getIdTokenClaims()['https://example.com/graphql_endpoint'];
		

		return  endpoint, token ;
	);

	/**
	 * TODO: check for autorization error and remove token from cache
	 * See: https://www.apollographql.com/docs/react/v3.0-beta/api/link/apollo-link-context/
	 */

	const apolloClient = new ApolloClient(
		cache: new InMemoryCache(),
		link: from([
			contextLink,
			new HttpLink(
				uri: endpoint || '',
				headers: 
					'Content-Type': 'application/json',
					Authorization: `Bearer $token`
				
			)
		])
	);

	return (
		<ApolloProvider client=apolloClient>
			<div />
		</ApolloProvider>
	);
;

export default App;

对于上面的 endpoint 和 token，我收到错误 TS2454（变量在分配之前使用）。知道如何解决这个问题吗？

【问题讨论】：

我不熟悉这种类型的代码，但它是否有可能在设置令牌和端点之前到达return endpoint, token ;？

【参考方案1】：

您将 endpoint 和 token 都声明为变量，但在检查 setContext 之前未将它们初始化为任何内容。

    let endpoint: string;
    let token: string;
    const contextLink = setContext(async () => 
        if (!token) 
            token = await getTokenSilently();
        
        if (!endpoint) 
            endpoint = await getIdTokenClaims()['https://example.com/graphql_endpoint'];
        

        return  endpoint, token ;
    );

尝试设置默认值：

let endpoint: string = "";
let token: string = "";