react的withRouter高阶组件:

withRouter的作用就是, 如果我们某个东西不是一个Router, 但是我们要依靠它去跳转一个页面, 比如点击页面的logo, 返回首页, 这时候就可以使用withRouter来做.

在 React Router 中,withRouter 是一个函数,用于与路由相关的组件。它接受一个组件作为参数,并返回一个新的增强过的组件。

这个增强过的组件可以访问到 React Router 提供的路由对象的属性和方法。

通常,当一个组件位于路由体系之外,例如在嵌套组件中或作为子组件传递时,

它可能无法直接访问路由对象(如history、location和match)。这时,可以使用 withRouter 将这个组件包装起来,使它能够通过 props 获取到路由对象。

复制代码
import React from 'react';
import { withRouter } from 'react-router-dom';

const MyComponent = ({ history, location, match }) => {
    // 可以通过 props 获取路由对象的属性和方法
    console.log(history, location, match);

    return <div>这是一个使用 withRouter 的组件</div>;
};
相关推荐
We་ct10 分钟前
LeetCode 42. 接雨水:双指针解法深度剖析与全方法汇总
前端·算法·leetcode·typescript
灰海18 分钟前
vue实现即开即用的AI对话打字机效果
前端·javascript·vue.js·打字机
摘星编程25 分钟前
React Native鸿蒙:TabBar自定义图标样式
react native·react.js·harmonyos
智绘前端26 分钟前
React 组件开发速查卡
前端·react.js·前端框架
箫笙默39 分钟前
前端相关技术简介
前端
Ulyanov44 分钟前
Impress.js深度技术解析:架构基础与结构化设计
开发语言·前端·javascript
小宇的天下1 小时前
Calibre :Standard Verification Rule Format(SVRF) Manual (1-1)
大数据·前端·网络
充气大锤1 小时前
前端实现流式输出配合katex.js
开发语言·前端·javascript·ai·vue
滴水未满1 小时前
uniapp的页面
前端·uni-app
邝邝邝邝丹1 小时前
vue2-computed、JS事件循环、try/catch、响应式依赖追踪知识点整理
开发语言·前端·javascript