TS在vue2專案中的寫法

2021-10-22 05:54:29 字數 763 閱讀 4552

作為對照,先回憶一下js在vue2專案中的寫法

本來vue2是不支援ts的,如果要在專案中使用ts,就需要相應的外掛程式和配置,雖然用起來有點尷尬,但終究也是能用了。

ts在vue2專案中,需要使用大量的修飾器,對我這樣的**懶人來說,一堆堆的修飾器,的確有點***。

要不是組織要求,我是絕對不會去寫這樣的**的。當然,鑑於ts型別檢查、提前報錯等優勢,有時候,麻煩點,就麻煩點吧。

這是前提,先把前期準備工作做好。

1. 建立專案

vue create ts-in-vue
2. 選擇ts預設

在詢問選擇preset的時候,選擇第三個進行自定義,用空格鍵選中typescript。

其他選擇按個人喜好,選好之後按回車。

後面會問幾個問題,可以一直回車,當然不同意可以按n。

3. 啟動專案

按提示就好,cd ts-in-vue,然後npm run serve。

實際專案中常常使用父子元件傳參,所以這裡也是採用這種形式來記錄。

1. 子元件helloworld.vue

模板部分如下:

}

}

同意拒絕

指令碼部分如下:

2. 父元件home.vue

改變

Vue2在實際專案中的應用 服務層介紹

所謂的服務層就是對http請求的封裝,最好不要直接在業務邏輯的 裡摻雜像下面類似的直接ajax呼叫 ajax 上面的 片段很難維護,會產生大量的重複 最好的辦法是對幾個http方法先進行一次封裝,我們會封裝成乙個http.utils.js,放到library中去 import vue from vu...

VUE3 0 TS 專案實戰 (2)基本寫法

vue3.0相容vue2.0寫法 理解為多了個setup composition api 實現功能拆分 復用 以適應大型專案 解決vue檔案在編輯同一功能時 變數和方法需寫在vue檔案的不同緯度 data methods 造成開發體驗上下反覆跳 同時解決mixin資料來源不明確性 compositi...

基於requirejs的vue2專案 三

這裡是打包篇 使用的是requirejs的r.js進行打包 思路是,通過entrance.js裡面的require.config進行專案的初打包 因為router.js和store.js裡面的引用是動態生成的,所以r.js無法對其進行處理,這裡我們用到了nodejs來進行檔案整合 具體看 node2...