Reactjs 反应：URL配置文件ID不'；t匹配（匹配参数id）

所以每当我点击查看配置文件链接时

 <Link to={`/profile/${_id}`} className="btn btn-primary">
                View Profile
 </Link>

这就是我的应用程序Js中的内容

   <Route
         exact
         path="/profile/:id"
         component={Profile}
     />

我认为它与我单击的按钮的URL不匹配

---

在Redux Devtools中，它只返回一个配置文件错误。

在这种情况下，生成警告的linter规则：

React Hook useffect缺少依赖项：“match.params.id”。包含它或删除依赖项数组

，都会告诉您存在另一个依赖项。改用这个：

const Profile = ({ getProfileById, match }) => {
useEffect(() => {
    getProfileById(match.params.id);
}, [getProfileById, match.params.id]);

return <div>test</div>;

const Profile=（{getProfileById，match}）=>{
useffect（（）=>{
getProfileById（match.params.id）；
}，[getProfileById，match.params.id]）；
回归试验；

linter不会浏览你的整个应用程序来确定在哪里以及如何使用

match

。它也不知道你将来打算如何使用它，因此，它要求你将它与

getProfileId

一起放在依赖项数组中

---

如果您导入了

getProfileId

，或者将其放置在组件之外，而不是作为道具传递，那么您可以安全地从依赖项中删除

getProfileId

。所有这些都意味着了解数组内部的内容需要更多的理解。Dan Abramov写了一篇很棒的文章，对我有所帮助仔细想想何时以及如何使用依赖关系数组。如果你发现Dan的文章有点过于宽泛，这可能是一个很好的开始，因为它涉及到编写弹性组件的更一般化的概念。

我设法找出了问题所在。它在我的API中。我正在尝试进入我的API

但在我的API中，它显示了补丁

我把它改成了一个

它是有效的

---

使用useEffect时，依赖关系数组参数意味着包含变量，该效果应监视这些变量的变化，以确定何时运行。linter告诉您传递它

[match.params.id]

。我该怎么做呢？在我接下来的教程中，这段代码是相同的，但可以很好地使用。我总是使用此注释（eslint禁用下一行react hooks/deps）工作正常。但这一个变得非常奇怪。我已经这样做了，在我的redux开发工具中，它返回了profile null。还有我的reducers profile错误。好吧，听起来问题与linter警告无关。

getProfileById

看起来像什么？另外，你可以排除你所说的

认为不是的内容通过检查react开发工具中的prop（甚至只是控制台记录
match.params.id
）与按钮的URL不匹配。这是我的getProfileById//getProfileById导出const getProfileById=（userId）=>async（dispatch）=>{try{const res wait axios.GET（
/api/PROFILE/user/${userId}
）；分派（{type:GET_PROFILE，payload:res.data，}）；
   <Route
         exact
         path="/profile/:id"
         component={Profile}
     />

const Profile = ({ getProfileById, match }) => {
useEffect(() => {
    getProfileById(match.params.id);
}, [getProfileById, match.params.id]);

return <div>test</div>;