Javascript React应用程序在两个位置使用相同的函数，但API调用不同。如何强制它每次都使用根？

因此，我正在开发一个应用程序，允许人们发表帖子和留言。我遇到了一个问题，如果我在两个不同的地方使用相同的addLikes和不同的函数，第二个就不起作用了

下面是我的操作/控制器文件中的函数

export const addLike = (id) => async (dispatch) => {
  try {
    const res = await axios.put(`api/posts/like/${id}`);

    dispatch({
      type: UPDATE_LIKES,
      payload: { id, likes: res.data },
    });
  } catch (err) {
    dispatch({
      type: POST_ERROR,
      payload: { msg: err.response.statusText, status: err.response.status },
    });
  }
};

// Unlike

export const unLike = (id) => async (dispatch) => {
  try {
    const res = await axios.put(`api/posts/unlike/${id}`);

    dispatch({
      type: UPDATE_LIKES,
      payload: { id, likes: res.data },
    });
  } catch (err) {
    dispatch({
      type: POST_ERROR,
      payload: { msg: err.response.statusText, status: err.response.status },
    });
  }
};

当我在显示从最新到最旧的所有帖子的页面上使用它时。空气污染指数旨在：

{name}
{text}

于{date}发布

addLike（_id）}
type='button'
className='btn btn灯'
>
{" "}
{likes.length>0&&{likes.length}
不像（_id）}
type='button'
className='btn btn灯'
>
讨论{“}
{comments.length>0&&(
{comments.length}
)}
{！auth.loading&&user==auth.user.\u id&&(
deletePost（_id）}
type='button'
className='btn btn危险'
>
)}

然后，我目前正在构建用于显示单个帖子的片段，API将其指向：

{name}
{text}

于{date}发布

addLike（_id）}
type='button'
className='btn btn灯'
>
{" "}
{likes.length>0&&{likes.length}
不像（_id）}
type='button'
className='btn btn灯'
>

这两个地点是：

              <PrivateRoute exact path='/posts' component={Posts} />
              <PrivateRoute exact path='/posts/:id' component={Post} />

---

如何强制相同的函数每次使用相同的精确路径？我不知道为什么第二种情况会在api前面添加额外的/posts/

您必须为Axios请求设置和配置默认的基本URL

例如：

// Axios configuration
axios.defaults.baseURL = "https://example.com/";

现在，无论何时发出请求，它都会自动将此默认baseURL作为前缀添加到每个请求中

比如：

axios.put（

api/posts/Like/${id}

）

到

axios.put（

${id}

）

你怎么会在
addLike
方法上发送Id。如果你正在创建一个like，你不应该有它的id。动词应该是post，而不是put
route/posts/:id不应该是精确的，因为
:id
是动态的
{likes.length>0&&{likes.length}
此行的目的是什么？？难道不是：

。。。。
渲染（）{
....
const likes=likes.length；
返回(
....
{likes}


有一些漏洞。您使用的是哪种路由器
如何设置axios？我建议您使用
npm I axios-es6-class
我认为现在的情况是，当您使用相对路由（如“/api/…”）时，axios只会将它们前置到当前路由。如果您指定绝对路径（），它应该保持一致。为什么你要在addLike方法上发送Id。如果你要创建一个like，你不应该有它的Id。动词应该是post，而不是put。对于评论，like与所有like的用户Id一起保存在一个数组中。当有人喜欢时，我会添加到数组中或删除。因此，我不是真正的创意我只是在更新喜欢它的人路线/posts/：id不应该准确，因为：id是第纳尔语*明白了。谢谢。{likes.length>0&&{likes.length}这条线背后的目的是什么？有点混乱。但原因是如果没有喜欢，我不希望在喜欢之后显示零。只有大于零的数字才会显示。我可能可以做得更优雅。啊，谢谢，这是有意义的。所以我的基本路由在根文件夹的my server.js中定义：好的，你哈我定义了这些。你还面临这个问题吗？我发现我缺少了一个“/"在地址之前。然后将其添加到路由将其返回到根目录。但现在我遇到了一个新问题。喜欢和不喜欢按钮现在正在尝试访问localhost:3000，这是网站。但我的my api在5000上。这种行为在其他任何地方都不会出现。我不确定是什么原因导致它。你必须代理请求通过在react的package.json文件中添加一行代码。
              <PrivateRoute exact path='/posts' component={Posts} />
              <PrivateRoute exact path='/posts/:id' component={Post} />

// Axios configuration
axios.defaults.baseURL = "https://example.com/";

....
render () {
....
const likes = likes.length;
return (
....
<span>{likes}</span>