React之JSX里render中return方法添加括號()或者[]


案例如下:

 

 結果:

 

 

問題:

react構建component的render方法中return后面為什么要加括號?

 

分析:

(1)官方說法

return 后面帶着一個圓括號,只是為了換行顯示,也可以是中括號[]
更符號原生編碼習慣的的思維,並且在一些IDE,例如webstrome中編寫時html標簽自動對齊方式更好看。

 

(2)驗證

  1、首先我們去掉(),測試下

  

 

   測試后發現渲染解析不出來

  2、改為[]

  

 

   

 

   測試后發現正常解析

  3、將代碼寫到return后,改為一行

  

 

   此時也可以正常解析渲染,但不太符號原生編碼習慣的的思維

 

(3)小結

1、圓括號的作用是分割作用域和執行,在render中是給babel-jsx解析用的,這樣寫更符號原生編碼習慣的的思維,也方便解析 2、return的圓括號是為了代碼換行,不用括號的話只能寫一行

 

 

 

 

 

 

.


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM