react-router

发布时间：2020-12-15 20:37:25 所属栏目：百科来源：网络整理

导读：1、window.location当前页面地址信息属性： href url完整地址 hash 路由，#开始的部分 search 查询部分，?开始的url host 主机名及端口号 hostname 主机名 pathname url路径部分方法： replace() 替换 reload() 重新加载如：http: // 172.16.87.204:8900/

1、window.location当前页面地址信息

属性：

href url完整地址

hash 路由，#开始的部分

search 查询部分，?开始的url

host 主机名及端口号

hostname 主机名

pathname url路径部分

方法：

replace() 替换

reload() 重新加载

如：http://172.16.87.204:8900/?s=1#/invoiceLottery/lotteryRecord?ss=22

href: "http://172.16.87.204:8900/?s=1#/invoiceLottery/lotteryRecord?ss=22"
hash: "#/invoiceLottery/lotteryRecord?ss=22"
search: "?s=1"
host: "172.16.87.204:8900"
hostname: "172.16.87.204"
pathname: "/"

2、浏览器history（浏览器历史记录）

history.back(); // 返回上级 （history.go(-1)）
history.forward(); // 跳转到下个页面（history.go(1)）
history.go(); // 用于指定页跳转

3、react的history对象

history改造的浏览器history(单页面hash改变加载不同内容)

history.location // 当前页面所在位置
history.push({ pathname: ‘/new-place‘ }); // 路由跳转
history.replace({ pathname: ‘/new-place‘ }); // 路由跳转(覆盖式)
history.goBack(); // 返回上一个页面
history.goForward(); // 跳转下一个页面
history.go(); // 用于指定页跳转
history.listen(); // 监听地址变化，执行相关操作

4、react-router是建立在history对象之上

一个history知道如何去监听浏览器地址栏的变化，并解析这个URL转换为location对象，

然后router使用它匹配到路由，最后正确地渲染对应组件

5、dva中dva-router使用routerRedux跳转路由

routerRedux.push();
routerRedux.replace();
routerRedux.goBack(); // 返回上一级路由（会刷新页面）

// model里面使用
yield put(routerRedux.goBack());

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!