Question

我将参数从react-router的路径路径传递给组件，但在this.props对象中，＆＃39; params＆＃39;

const routes = (
    <Router forceRefresh={true}>
        <div>
            <Route exact path="/" component={Firstpage}/>
            <Route exact path="/projects" component={Projectslist}/>
            <Route exact path="/projects/:projectId" component={Singleproject}/>
        </div>
    </Router>
);

这是我的组成部分：

class Singleproject extends React.Component{
    constructor(props) {
        super(props);
    }

    componentWillMount(){
        window.document.title = "Wploper | Project title";
    }
    render(){
        return(
            <div>
                <Mainheader/>
                <div id="single-project-container" className="sheet-max-width">
                    <h2>{this.props.params}</h2>
                </div>
                <Mainfooter/>
            </div>
        );
    }
}

对象（this.props）没有参数： enter image description here

Answer 1

测试了react-router v4 在您的Singleproject组件中，您可以通过以下方式获取参数：

this.props.match.params.projectId

下面是一个代码示例：

    class ForgotPassword extends Component {
        constructor (props,context){
            super(props,context);
            this.state={
                busy : true,
                sessionId : localStorage.getItem('sessionId') || null,
                resetKey : this.props.match.params.resetKey || ''
            };
            console.log(this);
        }
}

Answer 2

在react-router版本4中，您可以使用this.props.match.params

获取路径参数

Answer 3

您可以通过上下文从路线中获取参数。 this.context.params.projectId

在react-router上传递参数后，this.props.params不存在

3 个答案: