TypeScript-tsx文件中未识别类型参数?

TypeScript-tsx文件中未识别类型参数?,typescript,generics,jsx,Typescript,Generics,Jsx,我有一个名为test.ts的示例文件,其中包含以下代码: const test = <T>(a: string) => { return a; } ; 我必须使用.tsx扩展名,因为实际代码需要返回JSX元素。我还必须使用类型参数。但是我怎样才能同时做到这两个呢?TypeScript还使用尖括号来表示类型断言,因此JSX的语法会带来某些解析困难 因此,您可以将关键字用作: const test = (a: string) => { return a; } as T;

我有一个名为test.ts的示例文件,其中包含以下代码:

const test = <T>(a: string) => { return a; } ;

我必须使用.tsx扩展名,因为实际代码需要返回JSX元素。我还必须使用类型参数。但是我怎样才能同时做到这两个呢?

TypeScript还使用尖括号来表示类型断言,因此JSX的语法会带来某些解析困难

因此,您可以将关键字用作:

const test = (a: string) => { return a; } as T;

as运算符在.ts和.tsx文件中都可用,并且在行为上与其他类型断言样式相同。

tsx和泛型箭头函数不能很好地混合使用。最简单的解决方案是使用常规函数,因为您无论如何都不会从声明上下文中捕获它:

const withLazyStatus = function<T>(WrappedComponent: React.ComponentType<ILazyState<T>>) {
    return class WithLazyStatus extends React.Component<ILazyState<T>> {
        // Enhance component name for debugging and React-Dev-Tools
        static displayName = `withLazyStatus(${WrappedComponent.name})`;

        render() {
            let props = this.props;
            if (props.fetching) {
                return loading;
            } else if (props.error) {
                return error(props.error);
            } else {
                return <WrappedComponent {...this.props} />;
            }
        }
    };
};
或者,另一个选项是添加类型约束:

 const withLazyStatus = <T extends object>(WrappedComponent: React.ComponentType<ILazyState<T>>) {
        return  ...
  };

该约束将消除泛型vs标记结构的歧义

这在我的情况下不起作用,我正在更新问题,或者。看见简单地将答案标记为已接受,您可以在下面添加您的答案,这将为将来的读者标记此问题已解决。任何额外的东西都会被未来的游客视为噪音。不知道,这个答案是不能接受的。我应该发表我自己的答案,并接受它。不管怎样做。。。如果可以的话。同时,我自己也弄明白了,但你很快就把它作为答案发布了-@nagylzs在将来仍然可以供其他人参考:。我在发布后编辑了答案,并添加了第二个选项,该选项在YouneedArrow函数中也很有效,即genius
 const withLazyStatus = <T extends object>(WrappedComponent: React.ComponentType<ILazyState<T>>) {
        return  ...
  };