元素隐式具有“any”类型，因为类型为“string”的表达式不能用于索引

尝试一个React项目的TypeScript，我被这个错误困住了:

Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{ train_1: boolean; train_2: boolean; train_3: boolean; train_4: boolean; }'.
  No index signature with a parameter of type 'string' was found on type '{ train_1: boolean; train_2: boolean; train_3: boolean; train_4: boolean; }'

当我试图在我的组件中过滤数组时出现

.filter(({ name }) => plotOptions[name]);

到目前为止，我查看了文章“在TypeScript中索引对象”(https://dev.to/kingdaro/indexing-objects-in-typescript-1cgi)，因为它有类似的错误，但我尝试将索引签名添加到类型plotTypes，我仍然得到相同的错误。

我的组件代码:

import React, { Component } from "react";
import createPlotlyComponent from "react-plotly.js/factory";
import Plotly from "plotly.js-basic-dist";
const Plot = createPlotlyComponent(Plotly);

interface IProps {
  data: any;
}

interface IState {
  [key: string]: plotTypes;
  plotOptions: plotTypes;
}

type plotTypes = {
  [key: string]: boolean;
  train_1: boolean;
  train_2: boolean;
  train_3: boolean;
  train_4: boolean;
};

interface trainInfo {
  name: string;
  x: Array<number>;
  y: Array<number>;
  type: string;
  mode: string;
}

class FiltrationPlots extends Component<IProps, IState> {
  readonly state = {
    plotOptions: {
      train_1: true,
      train_2: true,
      train_3: true,
      train_4: true
    }
  };
  render() {
    const { data } = this.props;
    const { plotOptions } = this.state;

    if (data.filtrationData) {
      const plotData: Array<trainInfo> = [
        {
          name: "train_1",
          x: data.filtrationData.map((i: any) => i["1-CumVol"]),
          y: data.filtrationData.map((i: any) => i["1-PressureA"]),
          type: "scatter",
          mode: "lines"
        },
        {
          name: "train_2",
          x: data.filtrationData.map((i: any) => i["2-CumVol"]),
          y: data.filtrationData.map((i: any) => i["2-PressureA"]),
          type: "scatter",
          mode: "lines"
        },
        {
          name: "train_3",
          x: data.filtrationData.map((i: any) => i["3-CumVol"]),
          y: data.filtrationData.map((i: any) => i["3-PressureA"]),
          type: "scatter",
          mode: "lines"
        },
        {
          name: "train_4",
          x: data.filtrationData.map((i: any) => i["4-CumVol"]),
          y: data.filtrationData.map((i: any) => i["4-PressureA"]),
          type: "scatter",
          mode: "lines"
        }
      ].filter(({ name }) => plotOptions[name]);
      return (
        <Plot
          data={plotData}
          layout={{ width: 1000, height: 1000, title: "A Fancy Plot" }}
        />
      );
    } else {
      return <h1>No Data Loaded</h1>;
    }
  }
}

export default FiltrationPlots;

当前回答

我知道这有点晚了，但它所需要的只是添加一个小类型转换，我写了一个静态函数，安全地返回具有正确类型的键数组。你只需要定义类型并将对象作为参数传递:

export class ObjectUtil {
  public static getObjectKeys<T>(obj: Object) {
    if (!obj) {
      return [];
    }

    return Object.keys(obj).map((key: string) => key as keyof T);
  }
}

下面是一个简单的例子:

ObjectUtil.getObjectKeys<Address>(address).forEach((key) => {
  console.log(address[key]);
});

2021-11-28 15:29:16

其他回答

它为我工作的keyof和作为操作符:

const keys: [keyof ITrainInfo] = Object.keys(this.trainInfo) as [
    keyof ITrainInfo,
]
keys.forEach((property) => {
    // console.log(tmpUser[property])
    if (this.trainInfo === undefined) return
    if (this.trainInfo[property] !== undefined) {
        // your code here
        /*const trainsToSet = trains.find((field) => field.name === property)
        if (trainsToSet != undefined)
            trainsToSet.value = this.trainInfo[property]?.toString()
        */
    }
})

2022-05-18 06:51:27

输出打字错误

    const formData = new FormData();
    Object.keys(newCategory).forEach((k,i)=>{  
        var d =Object.values(newCategory)[i];
        formData.append(k,d) 
    })

2020-07-07 16:40:20

当使用Object时。按键，以下作品:

Object.keys(this)
    .forEach(key => {
      console.log(this[key as keyof MyClass]);
    });

2020-10-06 00:14:33

我通过使用keyof修复了这个问题

messageMap = {
 "Hi": "Hello",
 "Who are you": "My name is Test Sat Bot",
 "What is your role": "Just guide for the user",
}

这❌

let answer = this.messageMap[question];

替换为✔️

let answer = this.messageMap[question as keyof typeof this.messageMap];

这里的问题是字符串的类型。

getBotMessage(question: string){    
  let answer = this.messageMap[question as keyof typeof this.messageMap];
}

2023-01-03 16:44:46

TypeScript需要确保这些值存在于trainInfo中，否则它将全部读取为字符串

而不是这样做

interface trainInfo {
  name: string;
  x: Array<number>;
  y: Array<number>;
  type: string;
  mode: string;
}

这样做

interface trainInfo {
  name: "train_1" | "train_2" | "train_3"| "train_4";
  x: Array<number>;
  y: Array<number>;
  type: string;
  mode: string;
}

2022-12-14 08:35:14

元素隐式具有“any”类型，因为类型为“string”的表达式不能用于索引

推荐文章

最新文章

标签