React Native出现'product'隐式具有any类型报错如何修复

这个报错是TypeScript类型校验机制触发的：你没有为Card组件的入参product声明明确的类型，TS无法自动推断出该参数的类型时，就会抛出「隐式any类型」的错误。

方案1：显式声明类型（推荐） #

你只需要先定义好产品数据的类型，再给组件props绑定类型即可：

1. 首先定义产品数据的结构（根据你实际的产品字段调整内容）：

interface Product {
  id: string | number;
  name?: string;
  price?: number;
  // 其他你实际用到的产品属性都可以在这里补充
}

2. 给Card组件的props绑定类型：

const Card = ({ product }: { product: Product }) => (
  <View>
    {/* 你的组件业务逻辑 */}
  </View>
);

3. （可选）给FlatList补充类型校验，逻辑更严谨：

// 先给你的产品数组声明类型
const products: Product[] = [/* 你的产品JSON数据 */];

// FlatList指定泛型
<FlatList<Product>
  style={{ margin: 10, width: "100%" }}
  numColumns={2}
  data={products}
  renderItem={({ item }) => <Card product={item} />}
/>

方案2：临时兼容方案（不推荐） #

如果只是临时调试不想定义类型，可以显式声明product为any类型跳过校验：

const Card = ({ product }: { product: any }) => (
  <View>
  </View>
);

注意：该方案会失去TypeScript的类型保护能力，仅建议临时调试时使用。

内容的提问来源于stack exchange，提问作者doğan kısa