Reactjs 父组件更新后不重新呈现子组件

我有1个父组件(容器)和2个子组件(列表，selectedItem)，最初我呈现所有数据到容器，并发送所有数据到列表和第一个项目作为selectedItem组件.所以你好

当用户点击列表组件中的一个项目时，它会通过函数更新父项的选定项目，父项能够更新状态，但它不会重新呈现选定项目组件.

列表组件:

    import "./SelectedImage.css"

function ListSection({items, updateSelectedItem}) {
  return (
    <div className="list-section">
      <ul>
        {
          (items).map((item) => {
            return <li key={item.id} onClick={() => updateSelectedItem(item.id)}>{item.name}</li>
          })
        }
      </ul>
    </div>
  );
}

export default ListSection;

容器组件

    

    
import LeftSection from './LeftSection';
import logo from './logo.svg';
import RightSection from './RightSection ';
import SelectedItem from './SelectedItem';
import "./App.css";
import ListSection from './ListSection';
import { Component, useState } from 'react';

const products = [
  {id: 1, name: "Lime", size: ["large", "medium", "small"], category: "Juice", image: "lime-juice.jpg"},
  {id: 2, name: "Orange", size: ["large", "medium", "small"], category: "Juice", image: "orange-juice.jpg"},
  {id: 3, name: "Mango", size: ["large", "medium", "small"], category: "Juice", image: "mango-juice.jpg"},
]

function Container() {
  let [selectItem, setSelectItem] = useState(products[0]);

  function chooseSelectedItem(id) {
    let item = products.filter((value) => {
      console.log(value.id);
      return (value.id == id)
    })
    setSelectItem(item[0]);
    console.log(item[0]);
  }

  return (
    <div className="Container">
      <ListSection items={products} updateSelectedItem={chooseSelectedItem}/>
      <SelectedItem CurrentSelectedItem={selectItem}/>
    </div>
  );
}

export default Container;

已选项目组件

import QuantityBar from "./QuantityBar";
import "./SelectedImage.css"
import { useState } from "react";

function SelectedItem({CurrentSelectedItem}) {
  let [item, setItem] = useState(CurrentSelectedItem);  

  return (
    <div className="selected-item">
      {/* <img src={item.image} className="selected-image" /> */}
      {item.name}
      {/* <QuantityBar itemCount={0} /> */}
    </div>
  );
}

export default SelectedItem;