при нажатии на ссылку никаких действий не происходит

Question

Я пытаюсь передать реквизиты компоненту UpdatePassword в React, используя Router, Link, который визуализировал компонент UpdatePassword. Я удивлен, что ссылка работала раньше, но после некоторых изменений на стороне сервера, теперь, когда я нажимаю на нее, ничего не происходит. Также, если я отображаю страницу, добавляя URL вручную, компонент отображается, но отправленные данные не определены. Пожалуйста, предложите, что я могу сделать здесь?

Я импортировал их в компонент Dashboard

import {BrowserRouter as Router,withRouter,Link,Switch,Route}  from 'react-router-dom'

, и это мой оператор возврата в том же компоненте

   return  <>
       <Header/>
       <div id="wrapper">
        <div id="sidebar-wrapper">
            <ul class="sidebar-nav">
               <Router>
                <li> <Link to ={{pathname :"/updatePassword", state :this.state}}>Update Password</Link> </li>
                <li> <Link to ={{pathname :"/updateUserInfo", state :this.state}}>Update User Details</Link> </li>
               </Router>
             </ul>
        </div>
        <div id="page-content-wrapper">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12">
                        <h1>Welcome {str2}</h1>
                        <a href="#menu-toggle" class="btn btn-default" id="menu-toggle">Toggle Menu</a>
                        <Router>
                        <Route path='/updatePassword' component ={UpdatePassword}/>
                        </Router>
                 </div>
                </div>
            </div>
        </div>

    </div>
     </>;

В моем Компонент UpdatePassword, состояние реквизита не определено.

Answer 1

Пожалуйста, используйте -

<Route path='/updatePassword/parameter1/parameter2' component ={UpdatePassword}/>

Вместо этого -

<Route path='/updatePassword' component ={UpdatePassword}/>

И вместо этого -

<li> <Link to ={{pathname :"/updatePassword", state :this.state}}>Update Password</Link> </li>

используйте это -

<li> <Link to={`/updatePassword/${parameter1}/${parameter2}`}>Update Password</Link> </li>

Затем получите значения параметров для вашего компонента следующим образом -

let parameter1 = this.props.match.params.parameter1;
let parameter2 = this.props.match.params.parameter2;