Question

对于这个问题是否已经提出或对社区没有帮助，我感到抱歉，但是我被困在React Router中的URL中发送查询字符串。

我的客户希望拥有一个友好的URL，该URL应包含类别名称和零件目录号，即

http://localhost:8000/parts/alternators-11.2824。

现在，我以这种方式重定向到零件展示页面。

this.props.changeRoute(`/${subdomain}/parts/${category}-${partId}`)

简要说明：

subdomian可以是'en'或'de'或'fr'，具体取决于语言
category是零件所属的类别名称
partId是数据库中的零件ID。

所以我最终得到了这个URL：

http://localhost:8000/parts/alternators-1234

但是，URL应该包含目录号，而不是DB的部件ID，如下所示：

http://localhost:8000/parts/alternators-11.2824

这不适合我，因为那时有一个Saga中间件从API提取零件，并且需要后端数据库中的实际ID，因此无法通过目录号找到零件。

saga ajax请求看起来像这样：

export function* getPart(action) {
  const authOptions = yield call(authorizationHeader);
  const location = action.location;
  const url = location ? `${API_URL}/parts/${partIdFromUrl(location)}` : '';
  const partResponse = yield call(request, url, authOptions);
  if (!partResponse.err) {
    const response = normalize(partResponse.data.part, part);
    yield put(partLoaded(response.entities));
  } else {
    yield put(partLoadingError(partResponse.err));
  }
}

export function partIdFromUrl(location) {
  const partDataIndex = 3;
  const partIdIndex = 2;
  const pathnameArray = location.pathname.split('/');
  const partData = pathnameArray[partDataIndex].split('-');
  return partData[partIdIndex];
}

因此，我通过解析字符串从URL中提取了部件ID。

我不确定this.props.changeRoute的定义方式，我找不到该功能的定义，因此我猜它是在React Router核心库中的某个地方定义的。我尝试传递其他参数，例如：

this.props.changeRoute(`/${subdomain}/parts/${category}-${partId}`, {query: {partId: partId }})

但这没用。

我在项目中使用React，React Router，Redux和redux-saga中间件。我对这个项目很陌生，因为我已经被其他人接手了，但我还不太了解。

是否可以传递其他查询参数，以便以后可以通过ID调用API？

如何在React Router中正确发送查询

0 个答案: