Vue開發小技巧
Vue 3.x 的Pre-Alpha 版本。後面應該還會有 Alpha、Beta 等版本,預計至少要等到 2020 年第一季度才有可能釋出 3.0 正式版;
所以應該趁還沒出來加緊打好 Vue2.x 的基礎;
Vue基本用法很容易上手,但是有很多優化的寫法你就不一定知道了,本文從列舉了 36 個 vue 開發技巧;
後續 Vue 3.x 出來後持續更新.
1.require.context()
1.場景:如頁面需要匯入多個元件,原始寫法:
import titleCom from '@/components/home/titleCom'
import bannerCom from '@/components/home/bannerCom'
import cellCom from '@/components/home/cellCom'
components:{titleCom,bannerCom,cellCom}
2.這樣就寫了大量重複的程式碼,利用 require.context 可以寫成
const path = require('path')
const files = require.context('@/components/home', false, /\.vue$/)
const modules = {}
files.keys().forEach(key => {
const name = path.basename(key, '.vue')
modules[name] = files(key).default || files(key)
})
components:modules
這樣不管頁面引入多少元件,都可以使用這個方法
3.API 方法
相關文章
- Flutter 開發小技巧Flutter
- 開發小技巧-mockMock
- iOS 開發小技巧iOS
- Vue 開發技巧總結Vue
- 提高開發銷量小技巧
- 提高開發效率小技巧
- React開發的小技巧React
- Java開發小技巧(一)Java
- vue開發小想法Vue
- iOS開發小技巧合集iOS
- 小程式開發技巧總結
- 安卓開發的小技巧(2)安卓
- 安卓開發的小技巧(1)安卓
- 安卓開發的小技巧(3)安卓
- Vue元件開發小結Vue元件
- Vue 使用中的小技巧Vue
- React-native 開發小技巧React
- 開發提效小技巧分享(一)
- Python 專案開發小技巧Python
- Kotlin Android 開發小技巧KotlinAndroid
- Swift開發的幾個小技巧Swift
- 我開發中總結的小技巧
- vue外掛開發小知識Vue
- Vue開發必須知道的36個技巧Vue
- 你需要知道的小程式開發技巧
- iOS 開發的9個超有用小技巧iOS
- Android開發的那些坑和小技巧Android
- 五個 goland 進行 go 開發的小技巧GoLand
- js開發實戰優化小技巧001JS優化
- iOS開發常用小技巧記錄(持續更新)iOS
- 提高python開發效率的10個小技巧Python
- Delphi三層開發小技巧:TClientDataSet的Delta妙用client
- Laravel Vue 下拉框聯動小技巧LaravelVue
- vue js 部分使用小技巧(持續更新)VueJS
- Vue 開發經驗小記(持續更新)Vue
- 玩轉iOS開發:實戰開發中的GCD Tips小技巧 (二)iOSGC
- 內網埠轉發小技巧內網
- Android開發一點小技巧和建議獻上Android