Блог

Итак, я очень новичок в React, и я пытаюсь найти наилучший возможный способ перехода на другую страницу, когда пользователь выбирает опцию. В приведенном ниже коде я написал сам select, и его состояние меняется, но мне трудно даже понять, с чего начать маршрутизацию этого выбора на новую страницу.

 var Header = React.createClass({
 getInitialState: function() {
     return {
         value: 'select'
     }
 },
 change: function(event){
     this.setState({value: event.target.value});
 },
 render: function(){
    return(
       <div>
           <select id="lang" onChange={this.change} value={this.state.value}>
              <option value='./Doctor.js'>Doctor</option>
              <option value='./Pharma.js'>Pharmacist</option>
              <option value='./Admin.js'>Admin</option>
           </select>
       </div>
    );
 }
});

export default Header
  

Значения в значении параметра = — это маршруты, которые я пытаюсь выяснить, как маршрутизировать. Я пробовал просто использовать a, но получил кучу ошибок. Какие-либо советы?

если вы используете react-route , вы можете попробовать использовать this.props.history.push('/your route path') ;

и вам нужно изменить свою change функцию

 change: function(value){
  this.setState({value: value});
  this.props.history amp;amp; this.props.history.push(`/your route/${value}`)
},
  

вы можете сделать это так

 import React from 'react';
import { Link } from 'react-router';

export default class List extends React.Component {
  //some stuff here
  render() {
    return(
      <ul>
        <li><Link to='/doctor'>Doctor page</Link></li>
        <li><Link to='/pharmacist'>Pharmacist page</Link></li>
        <li><Link to='/admin'>Admin page</Link></li>
      </ul>
    )
  }
}