React道具未定义

时间:2016-07-06 14:24:10

标签: javascript reactjs react-router

我试图通过react-router将道具从一个组件传递到另一个组件。当我尝试从子组件获取道具时,我收到了此消息TypeError: this.props.params.appState is undefined。这是我的代码:

Tracks.jsx:

import { observable } from 'mobx';


export default class Tracks {
    @observable tracks = [];

}

app.jsx:

.......
import Tracks from './store/Tracks.jsx';

......
const appState = new Tracks();

ReactDOM.render(
    <Router history={browserHistory} >
        <Route path="/" component={Login} />
        <Route path="/dashboard" onEnter={authRequired} component={Main}>
            <Route path="album/create" component={AlbumCreate} />
            <Route path="album/:id" component={Album} appState={appState}/>
            <Route path="album/:id/upload"  component={Upload} />
        </Route>
    </Router>,
    document.getElementById('app')
);

Album.jsx:

.....
@observer
export default class Album extends React.Component {

    constructor(props) {
        super(props);
    }
componentDidMount () {
        console.log(this.props.params.appState.tracks);
    }

.....

1 个答案:

答案 0 :(得分:6)

更改此

this.props.params.appState

this.props.route.appState

Params是URL的动态片段,适用于需要路径的道具