react组件 如何获取URL 参数

Question

//客户端
index.js

import React from 'react';import ReactDOM from 'react-dom';import './index.css';import App from './App';import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'import registerServiceWorker from './registerServiceWorker';

ReactDOM.render(<div><Router><Route path='/supplies/:client_id' component={App}></Route></Router></div>, document.getElementById('root'));

App.js

class App extends Component {
  state = {users: [],          products:[]};
  
  steps = ['纺纱','织布','后整','检查入库','发货'];

  componentDidMount() {    console.log(this.props.params.client_id);  //不对这里
    fetch('/supplies/320001')
      .then(res => res.json())
      .then(products => this.setState({ products }));
  }

访问
http://localhost:3000/supplies/320001
http://localhost:3000/supplies/420001

如何获取320001 或 420001

Answer 1

this.props.params.client_id你是在哪里定义的。 打印下this，看是不是当前组件的实例 另外打印下 this.props.match.params