Reactjs 是否有方法使用React State更改视图?

Reactjs 是否有方法使用React State更改视图?,reactjs,routing,react-on-rails,Reactjs,Routing,React On Rails,很长一段时间以来,我一直在努力解决这个问题,但似乎找不到解决办法 在一些情况下,我正在处理的项目不能在Rails上使用React Router,但我听说有一种方法可以使用状态方法在组件之间切换。这是真的吗 在这个RubyonRails应用程序中,我们使用一个父组件,其中包含许多常量组件。问题是,我有三个用户需要点击的按钮,当它点击时,一个内容块必须改变 有什么想法吗?当然,这不是最佳选择,但我肯定会调查您为什么不能使用React路由器。试着打开另一个问题并解决这个问题 import HomeCo

很长一段时间以来,我一直在努力解决这个问题,但似乎找不到解决办法

在一些情况下,我正在处理的项目不能在Rails上使用React Router,但我听说有一种方法可以使用状态方法在组件之间切换。这是真的吗

在这个RubyonRails应用程序中,我们使用一个父组件,其中包含许多常量组件。问题是,我有三个用户需要点击的按钮,当它点击时,一个内容块必须改变


有什么想法吗?

当然,这不是最佳选择,但我肯定会调查您为什么不能使用React路由器。试着打开另一个问题并解决这个问题

import HomeComponent from 'home-component';
import AboutComponent from 'about-component';

const ROUTES = {
  home: HomeComponent,
  about: AboutComponent
};

class MainComponent extends Component {
  state = { component: HomeComponent }

  changeRoute = (routeName) => {
    this.setState({ component: ROUTES[routeName] || HomeComponent });
  }

  render() {
     const { component } = this.state;

     return (
       <div>
         <button onClick={() => changeRoute('home')}>Home</button>
         <button onClick={() => changeRoute('about')}>About</button>
         { component }
       </div>
     );
  }
}
从“主组件”导入主组件;
从“关于组件”导入关于组件;
常数路由={
home:HomeComponent,
关于:关于组件
};
类MainComponent扩展组件{
状态={component:HomeComponent}
changeRoute=(routeName)=>{
this.setState({component:ROUTES[routeName]| | HomeComponent});
}
render(){
const{component}=this.state;
返回(
changeRoute('home')}>home
changeRoute('about')}>about
{component}
);
}
}

这不是一个很好的方法,而且很明显,复杂性会迅速增加,但它可能适用于小型应用程序。

您只是在问如何有条件地呈现内容?您应该提供一些示例代码。