image.png

在umi3里面，跳轉(zhuǎn)時(shí)傳參數(shù)寫(xiě)法

// 帶參數(shù)跳轉(zhuǎn)到指定路由
history.push('/list?a=b');
history.push({
  pathname: '/list',
  query: {
    a: 'b',
  },
});

// 跳轉(zhuǎn)到上一個(gè)路由
history.goBack();

在umi4里面，跳轉(zhuǎn)時(shí)傳參數(shù)寫(xiě)法

// 帶參數(shù)跳轉(zhuǎn)到指定路由
// const state = { a: 1 }
history.push('/list?a=b&c=d#anchor', state);

// 帶參數(shù)跳轉(zhuǎn)到指定路由
history.push('/list?a=b&c=d#anchor');
history.push({
  pathname: '/list',
  search: '?a=b&c=d',
  hash: 'anchor',
  state: { a: 1 } // state地址欄不顯示，刷新后不消失
});

// 跳轉(zhuǎn)當(dāng)前路徑，并刷新 state
history.push({}, state)

// 跳轉(zhuǎn)到上一個(gè)路由
history.back();
history.go(-1);

umi4和 history 相關(guān)的操作，用于獲取當(dāng)前路由信息、執(zhí)行路由跳轉(zhuǎn)、監(jiān)聽(tīng)路由變更。

// 建議組件或 hooks 里用 useLocation 取
import { useLocation } from 'umi';
export default function Page() {
  let location = useLocation();
  return (
    <div>
     { location.pathname }
     { location.search }
     { location.hash }
     { location.state }
    </div>
  );
}

// 或者
import { history } from 'umi'
export default function Page() {
  return (
    <div>
      { history.location.pathname }
      { history.location.search}
      { history.location.state}
      ...
    </div>
  );
}

大部分內(nèi)容源自官網(wǎng)，可自行去umi3和umi4查看，因貼了官網(wǎng)地址導(dǎo)致文章被鎖，已將地址去掉