Javascript 获取错误：属性为'；未定义'；嵌套式反应路由器

我试图通过嵌套的react路由器获取数据，但未定义值

我的数据：

const data = [
    {
        id: 0,
        name: "Skateboard1",
        price: 20.10,
        img: picture1
    },
    {
        id: 1,
        name: "Skateboard2",
        price: 80.50,
        img: picture2
    }
]

App.js：

const App = () => {
  return (
    <Router>
      <Switch>
 
        <Route exact path="/shop/:id" render={(itemProp) => <ShopItem shopItemId={itemProp.match.params.id} />} />

      </Switch> 
    </Router>
    
  );
}

在

console.log（shopItemId）

这似乎是个愚蠢的错误。但我不知道怎么回事

---

请提供任何帮助。

函数

data.find（（i）=>i.id==shopItemId）

未找到任何与比较匹配的元素，因此

项

未定义

shopItemId

是一个对象，因此实际值是

shopItemId.shopItemId

并使用

=

运算符，因为一个值是

整数

，另一个值是

字符串

，如：

const item = data.find((i) => i.id == shopItemId.shopItemId)

---

是的，我知道它返回未定义，不知道为什么。上面我也发布了数据的内容。除了数据的内容之外，还有什么你想看的吗？

data

看起来不错，也许

shopItemId

有不同的值，或者它是一个

字符串

，需要一个

int

。我已经更新了我的问题，以显示

shopItemId

的值。请您再看一遍好吗？好的，问题是

shopItemId

是一个

字符串

，而

数据

元素的

id

是一个

整数

，

==

操作首先检查值的类型，因此

1

不等于

“1”

。你可以使用

=

代替

=

如

数据。查找（（i）=>i.id==shopItemId）

TypeError: Cannot read property 'name' of undefined

{
  shopItemId: "1"
}

const item = data.find((i) => i.id == shopItemId.shopItemId)