我有一个完整的项目清单被称为“命令”（PS：应用程序是法语的），它们显示在一个表中，每行有一列，应该将我重定向到另一个组件，该组件负责显示有关我重定向的行的更多细节，所以为了做到这一点，我当然应该使用useParams钩子来发送对象的id（在这种情况下，id在这里被称为“否”），然后我会将id发送到一个后端端点，它将获取对象的其余数据，我的问题是，我有ID（“否”）从源组件发送正确，并与正确的路由配置，它得到显示在URL作为一个参数时，我重定向，但当我记录“否”在目标组件中显示Undefined，请在下面找到解释的代码片段：
1.这是我最初从完整列表发送“否”并重定向到细节组件的第一个组件：

<td>
    <IconButton
    variant="outlined"
    color="error"
    style={{ color: "#02047a" }}
    onClick={() => handleDetailsClick(ligne.No)}>
    <LoupeOutlinedIcon />
    </IconButton>
</td>

2-这是处理按钮点击并将我重定向到新组件URL的函数，其中No作为参数

const history = useHistory();
    const handleDetailsClick = (No) => {  
      history.push(`/components/blocks/Hero/DetailsCommande/${No}`);
    };

3-这是我的param路由配置，当我重定向到它时，No在URL中很好地存在，我用不同的对象进行了测试，重定向与其中的param一起工作，请注意，我的路由配置在一个单独的文件中，我在我的app.js中调用该文件以呈现路由，每当我调用一个路由时，因为我有许多不同的路由（就目前而言，当我重定向时，路由与No一起工作正常）：

DetailsCommande: {
          name: "Details commandes",
          component: DetailsCommande,
          url: "/components/blocks/Hero/DetailsCommande/:No",
        },

3-这个函数应该处理我从useParams设置的const，并调用后端API来完成其余的工作，但现在当我在调用useParams钩子后立即记录参数时，我得到了UNDEFINED，所以它不是从URL中提取的：

const { No } = useParams();
console.log(No);

const fetchCommandeData = async (paramOrderNo) => {
  try {
    const response = await axios.get("/commande/details", {
      params: { No: paramOrderNo },
    });
    const responseLigne = await axios.get("/commande/getLignes", {
      params: { cmdNo: paramOrderNo },
    });

    setCommandeData(response.data); // Store the fetched commande response data
    setLigneCommandeData(responseLigne.data); // Store the fetched lignes response data
  } catch (error) {
    console.error("Error:", error);
  }
};

React.useEffect(() => {
  if (No) {
    fetchCommandeData(No);
  }
}, [No]);