ESLint - airbnb 如何適用 HoC
HoC 時常會使用一些屬性展開的寫法,在 ESLint 時常會報錯,我們可以設置一些專屬於 HoC 的配置
- 選配 -
html
:"ignore" 對於 HTML 標籤,忽略這條規則,這意味著在 HTML 標籤中使用屬性展開不會觸發警告 - 選配 -
explicitSpread
:若設為 "ignore" (預設 "enforce")- 正規寫法 :
<img prop1={prop1} prop2={prop2} prop3={prop3} }} />
- 可以這樣
<img {...{ prop1, prop2, prop3 }} />
- 但也不能這樣
<img {...props} />
- 正規寫法 :
- 主要 -
exceptions
: 為特定的元件提供例外情況,在這個例子中,WrappedComponent
是被允許使用屬性展開的元件 (這樣 HoC 內部都要使用WrappedComponent
作為參數,傳入被包裹的元件)
"react/jsx-props-no-spreading": [
2,
{
"html": "ignore",
"explicitSpread": "ignore",
"exceptions": ["WrappedComponent"]
}
],