0

React で前方参照を入力する方法について Stack Overflow で多くの回答を見てきましたが、一部の回答はアプリケーションの特定の部分で機能しますが、この場合はどれも機能しません。

React Native を使用しており、forwardRef でラップされた View コンポーネントを返します。ref パラメーターを入力することはできましたが、TS コンパイラーを満足させる props インターフェイスを作成できないようです。私が得たエラーについて奇妙なのは、 props インターフェイスを入力すると、参照をコンポーネントに渡すときにエラーがスローされることですが、私が言うように、参照は既に入力されています。これが私がしなければならない場所です：

import React, { forwardRef, ReactNode, Ref } from 'react';
import { View as RNView } from 'react-native';

export type X = unknown;
export type ViewPropsType<P> = { [key: string]: P };
export type ViewRefType = Ref<ReactNode> | ReactNode;

const View = forwardRef<ViewRefType, ViewPropsType<X>>((props, ref) => (
    <RNView ref={ref} {...props} />
));

View.displayName = 'View';

export default View;

TS コンパイラはref={ref}、props インターフェイスをタイプからany上記のものに変更すると、ここで and エラーを強調表示します。

No overload matches this call.
  Overload 1 of 2, '(props: ViewProps | Readonly<ViewProps>): View', gave the following error.
    Type 'ForwardedRef<ViewRefType>' is not assignable to type 'LegacyRef<View> | undefined'.
      Type 'MutableRefObject<ViewRefType>' is not assignable to type 'LegacyRef<View> | undefined'.
        Type 'MutableRefObject<ViewRefType>' is not assignable to type 'RefObject<View>'.
          Types of property 'current' are incompatible.
            Type 'ViewRefType' is not assignable to type 'View | null'.
              Type 'undefined' is not assignable to type 'View | null'.
  Overload 2 of 2, '(props: ViewProps, context: any): View', gave the following error.
    Type 'ForwardedRef<ViewRefType>' is not assignable to type 'LegacyRef<View> | undefined'.ts(2769)

何も使わずにこれを入力するにはどうすればよいですか?

4

0 に答える 0