鏃╀笂鍦╮eview浠ｇ爜鐨勬椂鍊欙紝鍙戠幇浜嗕竴浜涢棶棰樺拰閫昏緫澶嶇敤鐨勪竴浜涘皬鎶€宸с€傜劧鍚庤姳浜嗙偣鏃堕棿鏁寸悊浜嗕竴涓嬶紝鍋氫簡涓緥瀛愶紝璁蹭簡renderprops鏄粈涔堜笢瑗匡紵绠€鍗曟潵璇达紝renderprops鏄竴绉嶅湪缁勪欢涔嬮棿鍏变韩閫昏緫鐨勬妧鏈€傚皢涓€浜涙覆鏌撻€昏緫浠rops鐨勫舰寮忎紶閫掔粰Component锛屼笓娉ㄤ簬娓叉煋閫昏緫銆傛覆鏌撻亾鍏锋湁浠€涔堜綔鐢紵澶勭悊缁勪欢鐨勬覆鏌撻€昏緫銆備粈涔堟椂鍊欎娇鐢紵褰撴偍鍦ㄧ粍浠朵腑鍙戠幇閲嶅鐨勯€昏緫鎴栨ā寮忔椂銆備緥濡傦細閲嶅鐨刄I缁撴瀯鍏变韩鏌愪釜鏁版嵁婧愶紝鍏变韩鏌愪釜鍏ㄥ眬浜嬩欢锛堝婊氬姩銆佽皟鏁村ぇ灏忋€?..锛夈€傜幇鍦篸emo鍙璇翠笉缁冨亣鎶婃垙銆傛垜浠竴璧锋潵鐪嬩竴涓緥瀛愩€傛兂浜嗘兂杩樻槸鍐欎釜鎵嬭〃鍚э紝浼氬姩鐨勯偅绉嶏紙骞翠細娌′腑濂栵紝閫佷釜鎵嬮摼涔熷ソ銆傘€傘€傦級銆傜粡杩囦竴浜涙搷浣滐紝鎴戜滑鑺变簡涓€涓〃锛氱幇鍦ㄦ垜浠鎹㈣〃甯︼紝鎬庝箞鍔烇紵閲嶅啓涓€涓紵寰堟槑鏄句笉鏄€傝繖灏辨槸renderprops鐨勭敤姝︿箣鍦般€傛垜浠彲浠ュ皢姣忎釜閮ㄥ垎鍒嗗紑骞跺皢涓嶅悓鐨勯儴鍒嗕綔涓簆rops浼犲叆銆備笂闈㈢殑浠ｇ爜锛歝lassWatchextendsComponent{state={date:moment(),}staticpropTypes={face:PropTypes.func,}staticdefaultProps={face:date=>,}componentDidMount=()=>(this.TICK=setInterval(this.update,1000))componentWillUnmount=()=>clearInterval(this.TICK)update=()=>this.setState({date:moment()})render=()=>({this.props.face(this.state.date)})}Strap銆丅ezel銆丼creen绛夊厛涓嶅叧娉紝鎴戜滑鍙湅閲嶇偣锛欶ace銆傚鏋滄垜浠笉浼犻€掍换浣曚笢瑗匡紝鎴戜滑浼氬緱鍒颁竴涓┖鐨勮〃鐩橈細杩欐椂鍊欙紝鎴戜滑鍙互缁欏畠娣诲姞涓€涓狣efaultFace锛屾樉绀篐H:mmstaticdefaultProps={face:date=>,}澶浜嗐€傜幇鍦ㄥ啀缁欎粬鐪嬩竴鐪硷紝鑹充附鐨勯粍鑹诧細constSecondsFace=({date})=>{consthours=date.format('HH')constminutes=date.format('mm')constseconds=date.format('ss')return(<>{hours}{minutes}{seconds})}SecondsFace.propTypes=watchfacePropTypes;婊¤冻銆傝繖鏃跺€欐垜浠殑娓叉煋鏄繖鏍风殑锛歝lassAppextendsComponent{render(){return(}/>
);}}杩欐牱锛屾垜灏卞彲浠ユ妸鍏朵粬娆惧紡鐨勬墜琛ㄩ兘鍐欏嚭鏉ヤ簡锛氳垝鏈崀骞翠細鐨勫績鎯咃紝浠€涔堥兘娌℃湁寰楀埌瀹夋姎銆傚畬鏁翠唬鐮佸湪杩欓噷锛氫唬鐮侊紝鍠滄鐨勮瘽鍙互缁欎釜star銆侺iveDemo:codeOpenTipsDos馃憤褰撴湁缁勪欢鍙互鍏变韩鎴栬€呴儴鍒嗘覆鏌撻€昏緫閲嶅鏃讹紝Don't馃憥瀹佸彲涓嶇敤涔熶笉瑕佹互鐢ㄣ€傚湪浣跨敤PureComponents鏃堕伩鍏嶄娇鐢╮enderProps銆傞櫎闈炰綘鐨勯亾鍏锋槸闈欐€佸畾涔夌殑銆傛敞鎰忎簨椤光殸锔廟enderProp鍙槸涓€绉嶆妧鏈紝鍚嶅瓧鍙互鏄换浣曚笢瑗匡紝姣斿children銆傚ぇ澶氭暟鍙互浣跨敤RenderProp鐨勫満鏅篃鍙互浣跨敤HOC瀹炵幇锛屽弽涔嬩害鐒躲€傚氨杩欎簺浜嗐€?)濡傛湁閿欒锛岃鎸囨锛岃阿璋€傛洿澶氬弬鑰冿細https://reactjs.org/docs/rend...
