☰

TypeScript の type を持つオブジェクトでオートコンプリートが機能しなくなるのはなぜですか? 質問する

tag-icon • tag-icon typescript visual-studio-code webstorm
TypeScript の type を持つオブジェクトでオートコンプリートが機能しなくなるのはなぜですか? 質問する

1 つのオブジェクトにルートのリストがあり、それを別のファイルにインポートして、オブジェクト プロパティのオートコンプリートを有効にしたいと考えています。

インデックス.ts

import allRoutes from './routes';

allRoutes.routeHome;

ルート.ts

const allRoutes = {
  routeHome: '',
  routePortfolio: 'portfolio'
};

export default allRoutes;

すべて正常に動作します。ただし、次のようにタイプチェックのために allRoutes にタイプを追加すると、次のようになります。

const allRoutes: {[key: string]:string} = {
  routeHome: '',
  routePortfolio: 'portfolio'
};

または次のようになります:

interface IRoutes {
    [key: string]: string;
}

const allRoutes: IRoutes = {
    routeHome: '',
    routePortfolio: 'portfolio'
};

すべてが壊れる

WebStorm または VSCode でこれを試しました。オブジェクト プロパティに型を追加すると、オートコンプリートが機能しなくなります。なぜこのようなことが起こるのでしょうか? また、これを修正するにはどうすればよいでしょうか?

ベストアンサー1

定数を 型で初期化すると{ [key: string]: string }、元の型は失われます。元の型を保持しながら に代入可能であることを確認したい場合は、{ [key: string]: string }次のようにします。

function asStrings<T extends { [key: string]: string }>(arg: T): T {
  return arg;
}

const allRoutes = asStrings({
  routeHome: '',
  routePortfolio: 'portfolio'
});

そこには提案関数を呼び出す必要のないソリューションです。

おすすめ記事