react-router.js를 사용하고 있습니다. react.js를 사용하여 버튼을 클릭하면 두 번째 구성 요소 / 페이지로 표시 / 이동하고 싶습니다.
여기를 클릭하면 두 번째 페이지 / 구성 요소로 이동할 수 있습니까?
http://codepen.io/naveennsit/pen/RamvLj?editors=1010
var { Router, Route} = ReactRouter
class App extends React.Component {
render() {
return (<Router>
<Route path='/' component={first}></Route>
<Route path='/about' component={second}></Route>
</Router>)
}
}
class second extends React.Component {
render() {
return <label>second component</label>
}
}
class first extends React.Component {
handleClick(){
alert('--')
}
render() {
return <div>
<label>first component</label>
<button onClick={this.handleClick}>MOve to second page</button>
</div>
}
}
React.render( < App / > , document.getElementById('app'))
당신은 사용할 수 있습니다 Link
에서react-router
var { Router, Route, Link} = ReactRouter
class App extends React.Component {
render() {
return (<Router>
<Route path='/' component={first} />
<Route path='/about' component={second} />
</Router>)
}
}
class second extends React.Component {
render() {
return <label>second component</label>
}
}
class first extends React.Component {
render() {
return <div>
<label>first component</label>
<Link to='/about'><button>MOve to second page</button></Link>
{this.props.children}
</div>
}
}
React.render( < App / > , document.getElementById('app'))
도움이 되었기를 바랍니다
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다