reactjs子組件傳遞數(shù)據(jù)給父組件
父組件嵌套子組件，父組件的處理函數(shù)通過(guò)屬性的方式賦值組子組件（
<GenderSelect handleSelect={this.handleSelect}></GenderSelect>
），子組件通過(guò)觸發(fā)事件，委托調(diào)用父組件的處理函數(shù)，從而實(shí)現(xiàn)把值傳給父組件（return <select onChange={this.props.handleSelect}>，
handleSelect: function(event) {
this.setState({gender: event.target.value})
}
）

react實(shí)現(xiàn)路由可以直接使用react-router。 ReactRouter是由Ryan Florence開(kāi)發(fā)的應(yīng)用于ReactJS的路由組件，它通過(guò)定義ReactJS組件<Routes>及相關(guān)子組件來(lái)實(shí)現(xiàn)頁(yè)面路由的映射、參數(shù)的解析和傳遞。 以下是例子： var ReactRouter = require('react-router'); var Routes = ReactRouter.Routes; var Route = ReactRouter.Route; //定義整個(gè)頁(yè)面的路由結(jié)構(gòu) var routes = ( <Routes location="hash"> <Route path="/" handler={App}> <Route path="books" name="bookList" handler={Books}/> <Route path="movies" name="movieList" handler={Movies}/> </Route> </Routes> );

react實(shí)現(xiàn)路由可以直接使用react-router。ReactRouter是由Ryan Florence開(kāi)發(fā)的應(yīng)用于ReactJS的路由組件，它通過(guò)定義ReactJS組件及相關(guān)子組件來(lái)實(shí)現(xiàn)頁(yè)面路由的映射、參數(shù)的解析和傳遞。以下是例子：var ReactRouter = require('react-router'); 

Link組件用于正常的用戶點(diǎn)擊跳轉(zhuǎn)，但是有時(shí)還需要表單跳轉(zhuǎn)、點(diǎn)擊按鈕跳轉(zhuǎn)等操作。這些情況怎么跟React Router對(duì)接呢？
下面是一個(gè)表單。
?

1
2
3
4
5

<form onSubmit={this.handleSubmit}>
<input type="text" placeholder="userName"/>
<input type="text" placeholder="repo"/>
<button type="submit">Go</button>
</form>

第一種方法是使用browserHistory.push
?

1
2
3
4
5
6
7
8
9
10

import { browserHistory } from 'react-router'

// ...
handleSubmit(event) {
event.preventDefault()
const userName = event.target.elements[0].value
const repo = event.target.elements[1].value
const path = `/repos/${userName}/${repo}`
browserHistory.push(path)
},

第二種方法是使用context對(duì)象。
?

1
2
3
4
5
6
7
8
9
10
11
12

export default React.createClass({

// ask for `router` from context
contextTypes: {
router: React.PropTypes.object
},

handleSubmit(event) {

react實(shí)現(xiàn)路由可以直接使用react-router。
ReactRouter是由Ryan Florence開(kāi)發(fā)的應(yīng)用于ReactJS的路由組件，它通過(guò)定義ReactJS組件<Routes>及相關(guān)子組件來(lái)實(shí)現(xiàn)頁(yè)面路由的映射、參數(shù)的解析和傳遞。
以下是例子：
var ReactRouter = require('react-router');
var Routes = ReactRouter.Routes;
var Route = ReactRouter.Route;

//定義整個(gè)頁(yè)面的路由結(jié)構(gòu)
var routes = (
<Routes location="hash">
<Route path="/" handler={App}>
<Route path="books" name="bookList" handler={Books}/>
<Route path="movies" name="movieList" handler={Movies}/>
</Route>
</Routes>
);