React鎶ラ敊姒傝鍑虹幇鈥淓lementtypeisinvalid--expectedastring(forbuilt-incomponents)oraclass/function(forcompositecomponents)butgot鈥濋敊璇湁澶氱鍘熷洜锛氬鍏ョ粍浠舵椂锛屽皢榛樿瀵煎叆涓庡懡鍚嶅鍏ユ贩娣嗐€傚繕璁颁粠鏂囦欢涓鍑虹粍浠躲€傞敊璇湴灏哛eact缁勪欢瀹氫箟涓哄彉閲忚€屼笉鏄嚱鏁版垨绫汇€傝淇姝ら敊璇紝璇风‘淇濅娇鐢ㄨ姳鎷彿瀵煎叆鍛藉悕瀵煎嚭鑰屼笉鏄粯璁ゅ鍑猴紝骞朵笖浠呬娇鐢ㄥ嚱鏁版垨绫讳綔涓虹粍浠躲€備笅闈㈡槸涓€涓ず渚嬫潵璇存槑閿欒鏄浣曞彂鐢熺殑銆?/馃憞锔忓繀椤绘槸鍑芥暟鎴栫被锛堜笉鏄彉閲忥級constButton=;exportdefaultfunctionApp(){//鉀旓笍Warning:React.jsx:typeisinvalid--expectedastring//锛堝浜庡唴缃粍浠讹級鎴栦竴涓被/鍑芥暟//锛堝浜庡鍚堢粍浠讹級浣嗗緱鍒帮細return(
helloworld
);}涓婇潰鐨勪唬鐮侀棶棰樻槸锛屾垜浠０鏄庝簡杩斿洖JSX浠ｇ爜鐨凚utton鍙橀噺銆傚姛鑳界粍浠惰淇姝ら敊璇紝鎴戜滑蹇呴』鏀圭敤鍔熻兘缁勪欢銆?/馃憞锔忕幇鍦ㄦ槸functionconstButton=()=>{return
;};exportdefaultfunctionApp(){return(
helloworld
);}鐜板湪锛孊utton鏄竴涓嚱鏁板苟杩斿洖JSX浠ｇ爜銆傚彲浠ョ敤浣淩eact缁勪欢銆傛贩娣嗗鍏ュ拰瀵煎嚭鍙︿竴涓父瑙佺殑閿欒鏉ユ簮鏄贩娣嗛粯璁ゅ拰鍛藉悕鐨勫鍏ュ拰瀵煎嚭銆備娇鐢ㄩ粯璁ゅ鍑哄鍑虹粍浠舵椂锛屽繀椤荤‘淇濆鍏ユ椂涓嶅甫鑺辨嫭鍙枫€?/Header.js//馃憞锔廳efaultexportexportdefaultfunctionHeader(){return
Helloworld
;}鐜板湪锛屽繀椤讳笉甯﹁姳鎷彿瀵煎叆銆?/馃憞锔廳efaultimportimportHeaderfrom'./Header';exportdefaultfunctionApp(){return(
);}鍙︿竴鏂归潰锛屽鏋滄偍鐨勭粍浠舵槸浣跨敤鍛藉悕瀵煎嚭瀵煎嚭鐨勶紝鍒欏繀椤讳娇鐢ㄥぇ鎷彿瀵煎叆銆?/Header.js//馃憞锔弉amedexportexportfunctionHeader(){return
Helloworld
;}鐜板湪瀵煎叆缁勪欢鏃讹紝蹇呴』鐢ㄥぇ鎷彿鎷捣鏉ャ€?/馃憞锔弉amedimportimport{Header}from'./Header';exportdefaultfunctionApp(){return(
);}纭繚浣犳病鏈夊皢缁勪欢瀵煎嚭涓洪粯璁ゅ拰灏濊瘯灏嗗叾浣滀负鍚嶇О瀵煎叆锛堢敤澶ф嫭鍙锋嫭璧锋潵锛夛紝鍙嶄箣浜︾劧銆傚洜涓鸿繖鏄敊璇殑甯歌鍘熷洜銆傚鏋滈敊璇粛鏈В鍐筹紝璇风‘淇濋噸鏂板惎鍔ㄥ紑鍙戞湇鍔″櫒鍜孖DE銆傛鏌ヨ矾寰勬偍杩樺簲璇ョ‘淇濇ā鍧楃殑璺緞鎷煎啓姝ｇ‘銆佸ぇ灏忓啓姝ｇ‘浠ュ強鎸囧畾瀵煎嚭缁勪欢鐨勬枃浠躲€傜‘淇濊矾寰勬纭殑鏈€浣虫柟娉曟槸鍒犻櫎瀹冿紝寮€濮嬭緭鍏ヨ矾寰勶紝鐒跺悗璁╂偍鐨処DE甯姪鎮ㄨ嚜鍔ㄥ畬鎴愩€傚鏋滄偍鍦ㄥ紑濮嬭緭鍏ヨ矾寰勫悗娌℃湁鑾峰緱鑷姩瀹屾垚鍔熻兘锛屽垯鎮ㄧ殑璺緞鍙兘涓嶆纭€備娇鐢‥SM鍙‘淇濇偍涓嶄細灏咵S妯″潡涓嶤ommonJS璇硶娣锋穯銆傛偍搴旇鍙湪React.js搴旂敤绋嬪簭涓娇鐢ㄥ鍏?瀵煎嚭璇硶锛岃€屼笉鏄痬odule.exports鎴杛equire()璇硶銆侷mportingfromreact-router-dom鏈夋椂锛屽綋鎴戜滑浠巖eact-router鑰屼笉鏄痳eact-router-dom瀵煎叆鏌愪簺涓滆タ鏃讹紝涔熶細鍙戠敓姝ら敊璇€?/鉀旓笍BAD//import{Link}from'react-router';//鉁匞OODimport{Link}from'react-router-dom';濡傛灉浣犱娇鐢╮eactrouter锛岃纭繚浠巖eact-router-dom瀵煎叆锛岃€屼笉鏄粠react-router瀵煎叆銆傚綋鎴戜滑灏濊瘯浣跨敤涓嶆槸鍑芥暟鎴栫被鐨勪笢瑗夸綔涓虹粍浠舵椂锛屽畠浼氱敓鎴愨€淓lementtypeisinvalid--expectedastring(forbuilt-incomponents)oraclass/function(forcompositecomponents)butgot:鈥滈敊璇俊鎭€傞敊璇秷鎭偍搴旇鍦╣ot:涔嬪悗鏌ョ湅閿欒娑堟伅锛屽洜涓哄畠鍙兘琛ㄦ槑瀵艰嚧閿欒鐨勫師鍥犮€傚綋鎴戜滑浣跨敤涓€涓粍浠舵椂锛屾垜浠繀椤荤‘瀹氬畠鏄竴涓嚱鏁拌繕鏄竴涓被銆傚鏋滄偍浣跨敤浠讳綍鍏朵粬鍊间綔涓虹粍浠讹紝鍒欎細瀵艰嚧閿欒銆?/p>
