這次主要講的是react-router-dom的Route三個參數(shù)（component、render、children）的比較
先從需求說起：需要把最外層的方法（或者參數(shù)）帶入到路由控制的組件中去。
component
原項目中直接import一個組件，放入這個參數(shù)中
//index.js
import A from './xx';
<Route component = { A }/>
這樣想傳入變量或者方法就沒有辦法實現(xiàn)，然后找到了地址1中提到的component，上面寫到可以傳入一個inline function，剛好同時看到了地址2的內(nèi)容，正好驗證了上面說的，修改后代碼
const data = {key : 'value'};
<Route component = { props => {
? ? ? ?const obj = Object.assign({},{data : data},props);? ?//第二個obj是我希望傳入進去的參數(shù)
????? ? return? <A {...obj}/>
}}
接著就在組件A中的this.props看到了data參數(shù)，也得到了我們想要的結(jié)果。打印this.props
但是就有點郁悶，這個方法的 props 變量是從哪里來的，為什么可以傳入方法呢？接著我在定義obj上面添加了一個debugger，運行到斷點，在調(diào)用棧中發(fā)現(xiàn)了下面的代碼
姑且可以看出傳入了Route給的props（history、match等）和上下文。然后就沒有繼續(xù)往上追溯...
問題又來了：
如果這個時候index.js文件有一個state，當state改變（通過this.setState方法）使得index重新render，這個時候你就會發(fā)現(xiàn)，每次render對于組件A來說都是一次全新的渲染和調(diào)用（可以在A的contructor方法中打上log），這個又是為什么呢？讓我們一起看看地址1里面的一段話
尖頭指（的不太清楚）的地方有提到：如果為組件提供一個內(nèi)聯(lián)函數(shù)，那么每個渲染都會創(chuàng)建一個新的組件。這導致現(xiàn)有組件卸載和新組件安裝而不僅僅是更新現(xiàn)有組件。當使用內(nèi)聯(lián)函數(shù)用于內(nèi)聯(lián)渲染時，使用 render 或 children
所以我初略的總結(jié)：如果上面不是我們希望的，那么有兩種方式解決：
1.使用上面提到的 render 或者 children
2.把state控制的部分單獨擰出來獨立成一個組件，避免index組件的再次render，當然這個肯定是不好的，那么我們就看看上面提到的 render 和 children 吧
render
修改上面component的例子
<Route render = { props =>{
? ? return <A data={data} {...props}/ >
}}
在所謂的A組件中打印this.props和component是一樣的。
同時改變index中的state也不會使得重新create一個嶄新的A組件。pe 非
children
看描述感覺最大的作用是：允許您根據(jù)路由是否匹配來動態(tài)調(diào)整UI。
暫時沒有這方面的需求...
