React-router transitionTo 不是一个函数 [英] React-router transitionTo is not a function

问题描述

从'react'导入React；从反应路由器"导入{路由器，链接，导航}；导出默认类 ResourceCard 扩展 React.Component {使成为() {返回 (<div onClick={this.routeHandler.bind(this)}>关联

);}路由处理程序(){this.transitionTo('someRoute', {objectId: 'asdf'})}}

我听不懂，怎么了?我收到一个错误:未捕获的类型错误:this.transitionTo 不是函数

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

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

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

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

附言react-router、react等库都是最新的

解决方案

Navigation 组件是一个 Mixin，需要相应地添加到组件中.如果你想绕过 Mixin(我觉得这是 React-Router 的方向)，你需要像这样在组件上设置 contextTypes:

var ResourceCard = React.createClass({上下文类型:{路由器:React.PropTypes.func}, ...

然后你可以调用this.context.router.transitionTo.

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'})
    }
}

I can't get it, what's wrong? I'm receiving an error: Uncaught TypeError: this.transitionTo is not a function

I've tried everything I've find in docs or in gitHub issues:

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

the route and the param is correct, it works fine in this case:

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

p.s. react-router, react and other libraries is up to date

解决方案

The Navigation component is a Mixin and needs to be added to the component accordingly. If you want to bypass the Mixin (which I feel is the direction React-Router is going) you need to set the contextTypes on the component like so:

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

then you can call this.context.router.transitionTo.

这篇关于React-router transitionTo 不是一个函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！