or
or
By clicking below, you agree to our terms of service.
New to HackMD? Sign up
Syntax | Example | Reference | |
---|---|---|---|
# Header | Header | 基本排版 | |
- Unordered List |
|
||
1. Ordered List |
|
||
- [ ] Todo List |
|
||
> Blockquote | Blockquote |
||
**Bold font** | Bold font | ||
*Italics font* | Italics font | ||
~~Strikethrough~~ | |||
19^th^ | 19th | ||
H~2~O | H2O | ||
++Inserted text++ | Inserted text | ||
==Marked text== | Marked text | ||
[link text](https:// "title") | Link | ||
 | Image | ||
`Code` | Code |
在筆記中貼入程式碼 | |
```javascript var i = 0; ``` |
|
||
:smile: | ![]() |
Emoji list | |
{%youtube youtube_id %} | Externals | ||
$L^aT_eX$ | LaTeX | ||
:::info This is a alert area. ::: |
This is a alert area. |
On a scale of 0-10, how likely is it that you would recommend HackMD to your friends, family or business associates?
Please give us some advice and help us improve HackMD.
Do you want to remove this version name and description?
Syncing
xxxxxxxxxx
TS 樂趣無窮
Sean Huang / 2021-08-10
Interface 不加前綴
I
的理由→ TS 本身就已達成標注型別的目的
額外的心智負擔
interface
和type
若前綴
I
僅是為了註明它是個 Interface…🌰
分別以不同的方式宣告型別
User
此例中,IUser、TUser、RUser 三者完全等價
用
interface
宣告的那個並沒比較特別這三個甚至都可被
implements
(https://pse.is/不騙你)
當看到一隻鳥走起來像🦆、
游泳起來像🦆、
叫起來也像🦆,
那麼這隻鳥就可以被稱為🦆
無需擔心型別和變數
會命名衝突
型別總是以大駝峰命名
而變數總是以小駝峰命名
建議避免型別與 MUI 組件撞名
→ 容易混淆,一時難以分辨它是組件或是型別
🌰
↓
建議型別和變數命名高度相關
🌰
MUI 的 Pagination 組件(節錄)
props
PaginationProps
或Props
state
DialogState
或State
請直接向套件拿型別
🌰(節錄)
怎麼找?
運氣好的話
你會看到這個已匯出的型別定義
匯入
指定 handler 的型別
🎉 得到符合組件要求的參數型別
解決日益增長的
src/constants/type.ts
→ 抽出型別成獨立檔案並置於
src/types
例如
Controller.ts
、Model.ts
關於混搭 BS 和 MUI 樣式
→ 只用 BS 的網格相關 class 如
.row
、.col
、.container
等;其餘用 MUI 的組件如
<Box />
參考資料