React-router transitionTo 不是一个函数

2023-12-10

import React from 'react';
import { Router, Link, Navigation } from 'react-router';

export default class ResourceCard extends React.Component {
    render() {
        return (
                <div onClick={this.routeHandler.bind(this)}>
                LINK
                </div>                  
        );
    }
    routeHandler(){
        this.transitionTo('someRoute', {objectId: 'asdf'})
    }
}

我看不懂,怎么了? 我收到错误:Uncaught TypeError: this.transitionTo is not a function

我已经尝试了在文档或 gitHub 问题中找到的所有内容:

this.transitionTo('someRoute', {objectId: 'asdf'})
this.context.transitionTo('someRoute', {objectId: 'asdf'})
this.context.route.transitionTo('someRoute', {objectId: 'asdf'})
etc.

路线和参数是正确的,在这种情况下工作正常:

<Link to="'someRoute" params={{objectId: 'asdf}}

附注react-router、react 和其他库都是最新的


The Navigation组件是一个Mixin,需要相应地添加到组件中。如果你想绕过 Mixin(我觉得这是 React-Router 的发展方向),你需要在组件上设置 contextTypes,如下所示:

var ResourceCard = React.createClass({
    contextTypes: {
        router: React.PropTypes.func
    }, ...

然后你可以打电话this.context.router.transitionTo.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

React-router transitionTo 不是一个函数 的相关文章

  • React Jest/Enzyme 测试:useHistory Hook 破坏测试

    我对 React 还很陌生 所以请原谅我的无知 我有一个组件 const Login FunctionComponent gt const history useHistory extra logic that probably not n
  • Webpack SCSS 图像 URL 链接在嵌套路由上损坏

    这是我的目录结构 public src app js assets images logo b green png stylesheets nav scss And webpack config js module exports entr
  • 反应路由器中的查询字符串

    我正在尝试使用查询字符串设置路由路径 内容如下 www mywebsite com results query1 query1 query2 query2 query3 query3 我会像这样过渡到 结果 组件
  • 在 Ionic React 中隐藏登录屏幕上的选项卡

    我从 cli 创建了一个带有选项卡启动模板的离子反应应用程序 并向现有结构添加了登录功能 我做了什么 App tsx const App React FC gt
  • React.js 通过 Router 传递参数,而不是在 URL 中

    您好 我想从一个页面移动到另一页面并传递参数search and type 如果 URL 中没有这些参数 我可以使用 React Router 来实现此目的吗 我正在看这个https github com rackt react route
  • React router v4 - 如何访问通过重定向传递的状态?

    我正在 React 的帮助下制作一个登录页面 当登录成功时 该页面会重定向到另一个页面 让我将登录成功时渲染的组件称为 A 我想将从数据库获取的数据传递给组件 A 我通过将其传递到 重定向 组件的 状态 属性来实现此目的 但是 我不明白如何
  • React Router V4 使用 Material UI 在 ListItem 内实现 NavLink

    我是 React 新手 我创建了一个简单的应用程序Login and 仪表板页 我已经成功配置了我的公共路线 and 私人路线 with Redirect功能 但是当我想实施时材料 ui 核心 https material ui com 事
  • React Router + Axios 拦截器。如何进行重定向?

    我有一个 axios 拦截器 当用户被强制注销 由于令牌过期 时 我想返回我的主页 我不确定如何将反应路由器传递给它 我正在使用 mobx 但不确定这是否能帮助我解决这个问题 export const axiosInstance axios
  • 在redux中间件中使用react-router进行重定向

    我创建了一个中间件来检查请求是否返回无效的访问响应 如果状态是 401 我想将用户重定向到登录页面 这是中间件代码 import React from react import push replace from react router
  • React Router 3,与查询参数完全匹配

    在 React Router 3 中 如何精确匹配包含查询参数的路由 像这样的事情
  • 将服务器端渲染添加到 create-react-app

    我正在研究 create react app 和 SSR 我在这个 repo 中添加了 redux 和 react router gt https github com sarovin StarteKit https github com
  • 使用 Django、webpack、reactjs、react-router 解耦前端和后端

    我正在尝试在项目中解耦我的前端和后端 我的前端由以下组成reactjs和路由将完成react router 我的后端如果做成形式Django我计划使用前端对 Django 进行 API ajax 调用 现在我不确定如何让这两端正确地相互通信
  • React Router v4 基本名称和自定义历史记录

    我想为我的路由分配一个基本名称 我可以使用 BrowserRouter 来实现 不过 我还想指定自定义历史记录 以便我可以以编程方式导航我的用户 我可以用路由器做到这一点 然而我不能两者都做 是否可以扩展其中一个路由器以支持此功能或围绕其包
  • React 路由器将查询附加到 URL

    React 路由器似乎在我的路由末尾附加了一个查询 该应用程序由运行 Express 的节点服务器提供服务 我正在使用最新版本的反应路由器 1 0 0 rc1 例子 http localhost 8080 users k 8wsy62 两个
  • React 路由器匹配失败

    使用有什么好处Match and Miss组件来自react router over Router成分 我似乎找不到任何关于此的文档反应路由器文档 https github com ReactTraining react router tr
  • 如何导航到新页面 React Router v4

    我正在构建一个加密货币市场应用程序来练习reactjs 当应用程序启动时 具有某些属性的货币列表将显示为列表 我需要导航到不同的页面 新页面 Currency组件 而不加载当前页面底部的组件 目前我能够将其呈现在页面底部 但这不是我需要的
  • 将 props 传递给每个组件

    我正在类内部通过 React Router 渲染一堆路由 我需要组件能够访问正在触发渲染的类的实例 因为它将包含服务工厂的实例等 但是 我找不到任何有关将 props 传递到通过 React Router 渲染的组件的信息 或者对我来说更有
  • 在组件之间路由时如何保持 React 新的 Context API 状态?

    Summary 1 你知道当通过路由挂载 卸载时如何保持Context Provider的状态吗 2 或者你知道一个维护良好的 Flux 实现支持多个独立的存储吗 详细地 除了 React 组件自己的状态之外 到目前为止我主要使用的是 re
  • 有没有办法从函数内单击导航链接?

    基本上 我正在延迟导航 单击链接后 onClick 处理程序通过检查条件并调用另一个函数来阻止导航 如果满足特定条件 则仅该页面导航到另一个页面 那么我如何从该函数中触发 Navlink 单击 我能够通过使用解决这个问题event prev
  • React Router 总是将我重定向到不同的 url

    我是 React 和 React Router 的新手 我正在使用 React Router v4 并遵循基于以前版本的教程 但我让它工作了 使用在 SO 上找到的一些东西和 React Router v4 文档上的一些东西 但有一件事困扰

随机推荐

  • 如何使用 C# 解压 docx 文件?

    如何使用 C 解压 docx 文件 新的 Office 文件扩展名 docx potx xlsx 等 在上传到 Web 服务器然后下载时会变成 zip 文件 这些文件格式现在使用 Open XML 文件格式系统 因此它们与 Google O
  • 将 .org 指令与 .data 部分中的数据一起使用:与 ld 相关

    在我努力了解如何使用 GNU binutils 来构建一个简单的引导加载程序时 使用gas我遇到过这样的问题 如何告诉链接器将数据放置在使用 org 推进位置计数器的文件中 同时将文件大小保持在 512 字节 我似乎找不到办法做到这一点 尝
  • 创建 Gmail 共享链接

    我想在我的单页 Web 应用程序上放置一个按钮 允许用户通过 Gmail 发送链接 我发现有些网站 例如 addthis com 提供了这样的按钮 但是该按钮自动使用网址栏中的链接 由于我有一个单页 Web 应用程序 因此网址栏中的链接将始
  • 嵌入数组中嵌入文档中的项目字段

    我有以下查询 cursor self postCol aggregate graphLookup from pCol startWith parent connectFromField parent connectToField id as
  • Java 中的散列——结构和访问时间

    我正在寻找两个不同但相关的论点的验证 上述论点 A 及以下 B Q 中的第一行行注释 A 道路HashMap的结构是 a HashMap是一张普通的桌子 这就是直接内存访问 DMA 背后的整个想法HashMap 或一般的散列 首先 是将这种
  • 微软团队机器人自适应卡片轮播删除卡片

    我正在将 Microsoft 团队机器人与 Node js 一起使用 我正在渲染自适应卡的轮播 并在每张卡上执行操作 我的要求是删除单击该操作的单个卡片 是否可以 当前代码如下所示 我尝试过删除活动 但这会删除整个轮播 const Turn
  • 使用我的数据库中的数据计算年龄

    这是我当前正在使用的代码 但它不起作用 Geboortedatum 在荷兰语中是出生日的意思 mysql connect xxx xxx xxx mysql select db xxx result mysql query select G
  • 如何从 Facebook Graph API 获得响应能力?

    我可以从 Facebook Graph API 中提取一个指标来告诉我其中一个 两个吗Response Rate and or Average Response Time从页面 我将附上我所指内容的屏幕截图 当我进入 设置 gt 见解 gt
  • 无法在 AutoMapper 5 中从 ViewModel 映射到 ApplicationUser

    我有一个从 ApplicationUser 基类 ASP NET Identity 继承的 Student 类 它有一个名为 StudentViewModel 的 ViewModel 如下所示 实体类 public class Applic
  • Google Play 说我的 apk 使用两个本机平台(我的库),因此它支持 0 台设备

    当我在 Google Play 上发布 apk 时 它显示 支持 0 台设备 在 apk 描述的底部写着 本机平台 actionbarsherlock SherlockNavigatorDrawer 这些是我用于我的项目的库 它们不是 ja
  • 在 C++ 中模拟 lambda 的复制赋值运算符

    这个问题有两个部分 Firstly 有人可以解释 C 禁用 lambda 的复制赋值运算符背后的基本原理吗 如果您要允许复制构造函数 为什么不允许复制赋值运算符呢 Secondly 如何在不强迫人们编写 C 03 风格函子或使用 std f
  • MediaElement 和 RTSP

    MediaElement 支持 RTSP 吗 我有一个流正在运行 我可以通过以下方式使用 VLC 播放器使用该流 rtsp 192 168 1 17 554 stream 但是 当尝试使用 Windows Media Player 时 我无
  • 如何将一个巨大的矩阵逐行写入文件(fortran 90)

    我想将一个包含大量数据的矩阵逐行写入文件中 例如 我有一个 100 100 的矩阵 我想在文件中以 100 100 的形式保存它 但是 它不起作用 以下是我的代码和一些描述 N和M是数百左右的整数 RECL 是预期长度我设置了文件 但在这里
  • 如何通过行列切换进行矩阵转换?

    我有一个由元素组成的方阵 1 或 0 第 i 行切换会切换所有第 i 行元素 1 变为 0 反之亦然 并且第 j 列切换切换所有 第 j 列元素 我有另一个方阵 大小相似 我想将初始矩阵更改为 使用最少切换次数的最终矩阵 例如 0 0 1
  • 使用清单的 DLL 重定向

    我需要可靠地重定向应用程序对特定 DLL 的查找 使用 app exe local 方法不起作用 因为如果应用程序具有清单 嵌入或单独的文件 则本地文件将被忽略 因此 我尝试通过在清单中将 DLL 定义为私有程序集来进行 DLL 重定向 我
  • 线性时间排序? [关闭]

    Closed 这个问题不符合堆栈溢出指南 目前不接受答案 给定 0 n 3 1 范围内的 n 个整数的输入集 提供线性时间排序算法 这是我周四测试的回顾 我不知道如何解决这个问题 也看看相关的排序 鸽巢排序 or 计数排序 也基数排序正如普
  • 从 VSTO PowerPoint 功能区调用 VBA AddIn 宏

    我在这个问题上被困了几个小时 我正在用 C 开发一个 PowerPoint 插件 我想使用另一个插件 PPAM 文件 中的宏 PPAM 文件已安装并启用 在应用程序参考中我发现我需要使用Application Run方法 但我无法让它工作
  • Selenium——如何等待页面完全加载[重复]

    这个问题在这里已经有答案了 我正在尝试使用 Java 和 Selenium WebDriver 自动化一些测试用例 我有以下场景 有一个名为 产品 的页面 当我点击 查看详细信息 链接时 在 产品 页面中 会出现一个包含商品详细信息的弹出窗
  • 当组合根位于客户端时如何在 WCF 中注入依赖项

    在开始之前 我必须说 我可能咬得太多 但我正处于绝望的学习狂潮中 我需要很多帮助 我正在编写一个练习 从两本书中获取样本 1 Net 中的依赖注入 作者 Mark Seemann2 Brian Egan 和 Steve Valenzuela
  • React-router transitionTo 不是一个函数

    import React from react import Router Link Navigation from react router export default class ResourceCard extends React