Question

我正在尝试通过以下功能更新根组件中的网址：

const setHistory = ({ contractId, draftId, clauseClicked, category, history }) => {

  if (draftId) history.push(`${history.location.pathname}/draft/${draftId}`);

  if (clauseClicked) history.push(`${history.location.pathname}/clause/${clauseClicked.id}`);
...
};

理想的网址应为：/legal-contract/${contractId}/draft/${draftId}/clause/${clauseClicked.id}/category/${category.id}，具体取决于是否为每个参数分配了值。

但是根据我的逻辑，URL开始冒起重复。在可能的情况下记住历史记录堆栈时，最好的方法是在不重新加载页面的情况下设置网址？

Answer 1

您可以将最终路径收集到字符串变量中，并在检查完所有变量后使用history.push。

const setHistory = ({
  contractId,
  draftId,
  clauseClicked,
  category,
  history
}) => {
  let newPath = `/legal-contract/${contractId}`;

  if (draftId) newPath += `/draft/${draftId}`;
  if (clauseClicked) newPath += `/clause/${clauseClicked.id}`;

  // ...

  history.push(newPath);
};

动态设置历史记录，无需重新加载页面

1 个答案: