Question

h(Route, {
    path:
      '/A/:aId/:B?/:bId?/:C?/:cId?/:D?/:dId?',
    render: ({ history, match }) => App({ history, match }),
  })

我正在尝试创建一个可以包含4个参数的路由，具体取决于用户的操作。 A和aId是基本路线的一部分，因为它们是强制性的。其余的URL稍后由应用使用history.push()构建。我在需要时使用match来获取每个参数。

我现在面临的问题是，当页面加载上没有任何bId，cId和dId并且发生了应该更新网址的useraction时，网址中包含一堆0。

例如，如果用户操作使用值更新dId，则该网址将变为：/A/15656/B/0/C/0/D/734。

我不确定在存储B，C和D的传入ID时如何以不包含零的方式创建url。

match.params在应用中如下所示：

{
  "aId": "15656",
  "b": "b",
  "bId": "145763",
  "c": "c",
  "cId": "17023",
  "d": "d",
  "dId": "5b69ac98ab89a"
}

URL使用以下功能设置：

const setHistory = ({ ...props }) => {
const {
    match: { params },
  } = props;

  const urlParams = {
    aId: props.aId,
    cId: props.c.id || params.cId || 0,
    bId: props.bId || params.bId || 0,
    dId: props.dId || params.dId || 0,
  };

  let url = `/A/${urlParams.aId}/B/${urlParams.bId}/c/${
urlParams.cId
  }/d/${urlParams.dId}`;

  props.history.push(url);
};

反应路由器动态URL参数

0 个答案: