Javascript 没有带类型为'；的参数的索引签名；字符串'；在类型DataType上找到

我有一个基本的React应用程序，它只是过滤一个对象，删除它的空字段

import "./styles.css";

type DataType = {
  data1: string;
  data2: string;
};

const App: React.FC = () => {
  const [data, setData] = useState<DataType>({
    data1: "",
    data2: ""
  });

  // Create temp obj and remove empty fields
  const removeEmptyFields = () => {
    const filteredData = data;
    Object.keys(filteredData).forEach(
      (key) => filteredData[key] === "" && delete filteredData[key]
    );
    setData(filteredData);
  };

  const addEmptyFields = () => {
    setData({
      data1: "",
      data2: ""
    });
  };

  console.log(data);

  return (
    <div className="App">
      <button onClick={addEmptyFields}>Add empty fields</button>
      <button onClick={removeEmptyFields}>Remove empty fields</button>
    </div>
  );
};

export default App;

导入“/styles.css”； 类型数据类型={ 数据1：字符串； 数据2：字符串； }; 常量应用程序：React.FC=（）=>{ const[data，setData]=useState({ 数据1:“”， 数据2:“ }); //创建临时对象并删除空字段 常量removeEmptyFields=（）=>{ 常量filteredData=数据； key（filteredData）.forEach( （键）=>Filteredata[key]==“”&删除Filteredata[key] ); 设置数据（过滤数据）； }; 常量addEmptyFields=（）=>{ 设置数据({ 数据1:“”， 数据2:“ }); }; 控制台日志（数据）； 返回( 添加空字段 删除空字段 ); }; 导出默认应用程序； 我试图实现的是将函数转换为Typescript，但在

filteredData[key]

上遇到以下错误：

元素隐式具有“any”类型，因为表达式的类型为 “字符串”不能用于索引类型“数据类型”。
找不到具有“string”类型参数的索引签名 在类型“数据类型”上。ts（7053）

我尝试了许多解决方案，其中一些是可以找到的，但没有一个能解决这个错误

事实上，我在很多地方都遇到过这个问题，我需要在“key”位置获取对象（

obj[key]

），但我不明白在这种情况下，Typescript实际上缺少什么

可以找到一个工作操场

---

我们非常感谢您的任何建议，因此提前非常感谢您

您可以使用类型断言：

const removeEmptyFields = () => {
    const filteredData = data;
    (Object.keys(filteredData) as (keyof DataType)[]).forEach(
      (key) => filteredData[key] === "" && delete filteredData[key]
    );
    setData(filteredData);
  };

---

最好避免修改原始对象

type DataType = { [key: string]: string }

const [data, setData] = useState<DataType>({
  data1: '',
  data2: '',
})

const removeEmptyFields = () => {
  const filteredData = Object.entries(data).reduce(
    (acc, [key, value]) => ({ ...acc, ...(value !== '' && { [key]: value }) }),
    {}
  )
  setData(filteredData)
}

type数据类型={[key:string]：string}
const[data，setData]=useState({
数据1:“”，
数据2:“”，
})
常量removeEmptyFields=（）=>{
const filteredData=Object.entries（data.reduce）(
（acc，[key，value]）=>（{……acc，…（value！==''&&{[key]：value}），
{}
)
设置数据（过滤数据）
}