Vue命名規范


views 命名

views 文件夾下面是由 以頁面為單位的vue文件 或者 模塊文件夾 組成的,放在 src 目錄之下,與 components、assets 同級。

views 下的文件夾命名

  1. views 下面的文件夾代表着模塊的名字
  2. 由名詞組成(car、order、cart)
  3. 單詞只能有一個(good: car order cart)(bad: carInfo carpage)
  4. 盡量是名詞(good: car)(bad: greet good)
  5. 以小寫開頭(good: car)(bad: Car)

views 下的 vue 文件命名

  1. views 下面的 vue 文件代表着頁面的名字
  2. 放在模塊文件夾之下
  3. 只有一個文件的情況下不會出現文件夾,而是直接放在 views 目錄下面,如 Login Home
  4. 盡量是名詞
  5. 大寫開頭,開頭的單詞就是所屬模塊名字(CarDetail、CarEdit、CarList)
  6. 名字至少兩個單詞(good: CarDetail)(bad: Car)
  7. 常用結尾單詞有(Detail、Edit、List、Info、Report)
  8. 以 Item 結尾的代表着組件(CarListItem、CarInfoItem)

vue 方法命名

vue 方法放置順序

  1. components
  2. props
  3. data
  4. created
  5. mounted
  6. activited
  7. update
  8. beforeRouteUpdate
  9. metods
  10. filter
  11. computed
  12. watch

method 自定義方法命名

  1. 動賓短語(good:jumpPage、openCarInfoDialog)(bad:go、nextPage、show、open、login)
  2. ajax 方法以 get、post 開頭,以 data 結尾(good:getListData、postFormData)(bad:takeData、confirmData、getList、postForm)
  3. 事件方法以 on 開頭(onTypeChange、onUsernameInput)
  4. init、refresh 單詞除外
  5. 盡量使用常用單詞開頭(set、get、open、close、jump)
  6. 駝峰命名(good: getListData)(bad: get_list_data、getlistData)

data props 方法注意點

  1. 使用 data 里的變量時請先在 data 里面初始化
  2. props 指定類型,也就是 type
  3. props 改變父組件數據 基礎類型用 $emit ,復雜類型直接改
  4. ajax 請求數據用上 isLoading、isError 變量
  5. 不命名多余數據,現在是詳情頁、你的數據是 ajax 請求的,那就直接聲明一個對象叫 d,而不是每個字段都聲明
  6. 表單數據請包裹一層 form

生命周期方法注意點

  1. 不在 mounted、created 之類的方法寫邏輯,取 ajax 數據,
  2. 在 created 里面監聽 Bus 事件




免責聲明!

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



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