在開發react元件時我們通常需要處理2個問題：
例項化這個元件以便除錯
為這個元件編寫使用文件以便更好的讓別人知道怎麼使用這個元件
最原始的方法莫過於開發時建乙個頁面用於除錯，開發完後再為其手寫文件。然而乙個詳細的react元件文件應該包括：
為各種使用場景編寫demo以及對應的說明，同時附上demo的原始碼
有demo可以當場體驗而不是使用者要自己寫**後才能體驗這個元件
它的屬性列表(proptypes)
它的例項方法列表
如果你想做到以上估計得花上你一天的功夫，我希望能把精力放在開發更好的元件上剩下的能毫不費勁的優雅完成，於是我做了本文的主角redemo。
redemo是用來簡單優雅的完成以上問題讓你專注於開發自己的元件，剩下的一切它都為你做好了。先看下redemo為元件生成文件的效果圖或直接體驗部分實踐中的專案redemo文件、imuix：
結構如下：
為你的元件生成這個你幾乎不用寫超過10行簡單的**更不用單獨為元件寫文件。假設你編寫了乙個button元件，讓我們來為button元件編寫乙個demo：
通過npm i redemo安裝redemo
寫下這些簡單的**
import redemo from 'redemo';
import demo from './demo';//為乙個使用場景例項化button元件的demo原始碼
// 使用docgen 從 button 元件原始碼裡分析出 proptypes
const docgen = require('!!docgen-loader!../button');
// 讀取為button元件編寫的demo的原始碼
const code = require('!!raw-loader!../demo');
const doc = `為這個demo做一些說明，支援*markdown*`
render(
)
proptypes寫注釋，就像這樣：
class button extends component
...}
希望redemo可以提公升你的效率，覺得有用可告訴你的朋友。
閱讀原文
react自動生成React元件命令
好久沒有用vscode了，可以說越來越強大了。但是偶然也要用用，react新建了乙個元件，輸入import，沒有自動補全，還要自動手工輸入，比較麻煩。網上也找了文章處理，發現還是不起作用。解決 rcc 現在來講講，這個命令是哪來的，為什麼我輸入rcc，就自動幫我寫上了以上的 其實是react sni...
React 系列 寫出優雅的路由
自前端框架風靡以來，路由一詞在前端的熱度與日俱增，他是幾乎所有前端框架的核心功能點。不同於後端，前端的路由往往需要表達更多的業務功能，例如與選單耦合 與標題耦合 與 麵包屑 耦合等等，因此很少有拆箱即用的完整方案，多多少少得二次加工一下。優秀的框架可以縮短 90 以上的無效開發時間，螞蟻的 umij...
React 快速上手 2 元件通訊
父元件可以通過設定子元件的props屬性進行向子元件傳值，同時也可以傳遞乙個 函式，來獲取到子元件內部的資料。效果演示 子元件是輸入框，父元件及時獲取到輸入框內容然後更新右邊標籤。父元件傳遞 函式 父元件傳遞乙個方法，即updatespan，用於更新span內容。class father exten...