-
55555
查看全部 -
444444
查看全部 -
444444
查看全部 -
44444
查看全部 -
11111111111
查看全部 -
11122222
查看全部 -
22222
查看全部 -
22222
查看全部 -
11111111
查看全部 -
第一篇筆記
查看全部 -
drop-shadow
查看全部 -
<div?id="container"></div> <script> ????var?destination?=?document.querySelector("#container"); ????var?Square?=?React.createClass({ ????????render:function(){ ????????????var?squareStyle?=?{????????????//CSS樣式 ????????????????height:?150, ????????????????backgroundColor:?this.props.color ????????????}; ????????????return?( ????????????????<div?style={squareStyle}> ????????????????</div> ????????????); ????????} ????}); ????var?Card?=?React.createClass({????????????//父控件 ????????render:function(){ ????????????var?cardStyle?=?{ ????????????????height:?200, ????????????????width:?150 ????????????}; ????????????return?( ????????????????<div?style={cardStyle}> ????????????????????<Square?color={this.props.color/>??????//調(diào)用組件并傳遞屬性 ????????????????</div> ????????????????); ????????} ????}; ????ReactDOM.render( ????????<div> ????????????<Card?color="#FF6663"/>????????//渲染 ????????</div>, ????????destination ????????); </script>查看全部 -
<div?id="container"></div> <script> ????var?destination?=?document.querySelector("#container"); ????ReactDOM.render( ????????<h1>I?am?Tyler</h1>, ????????destination ????????) </script>查看全部 -
父組件更新時（子組件props變更），子組件會先調(diào)用componentWillReceiveProps方法，然后執(zhí)行的生命周期順序和子組件state變更一樣
查看全部 -
react生命周期
查看全部 -
? ? ? ? ? ? ? ?React.creatclass創(chuàng)建組件對象是否被class?xxx? extends?React.Component取代
查看全部 -
1.react特點：
①提高數(shù)據(jù)和界面的邏輯耦合度：
????提供自動化的UI管理
????數(shù)據(jù)和界面之間構(gòu)造聯(lián)合層，將數(shù)據(jù)變化轉(zhuǎn)換成一系列事件，開發(fā)者只需根據(jù)事件轉(zhuǎn)變頁面狀態(tài)。
②更高效的DOM操作
????將對dom的操作放在虛擬dom上，通過緩存，一次提交給dom，高效。
③小個的可重用UI組件設(shè)計
④依賴JS開發(fā)界面，JSX語法結(jié)構(gòu)定義界面，擺脫了CSS影響
⑤相當于MVC中的V
查看全部 -
因為react數(shù)據(jù)的單向流動，所以當嵌套組件的最內(nèi)層想要獲取最父級數(shù)據(jù)時，數(shù)據(jù)遵循自上而下單向流動的規(guī)則，既該數(shù)據(jù)要自父級開始經(jīng)過所有嵌套的組件，才能最終到達最內(nèi)層組件，如果每個組件進行props屬性名的綁定，將是難以維護的。
解決辦法是，依然使用props逐級傳遞，但是可以使用es6對象的拓展操作符，自動綁定所有屬性名：<Tpl {...this.state.sth} />。
另外自react16開始，還可以使用createContext在組件之間共享數(shù)據(jù)，使用provider標簽包裹父組件，consumer標簽包裹子組件。
查看全部
舉報