原创 VUE2/3差異之模板寫法

Options API (選項API) 傳統的組件隨着業務複雜度越來越高,代碼量會不斷的加大,整個代碼邏輯都不易閱讀和理解。雖然儘量一個文件不要寫太多代碼(1000行內),但總有一些大型組件要一個文件寫很多代碼 優點:各選項編寫寫位置固定,

原创 數組方法ES5 + ES6

    sort / reverse 主要用於排序,會影響原來數組。 const arr = [1, 2, 3] arr.sort(); // 正序 arr.reverse(); // 反序 arr.sort(() => 0.5 - M

原创 JS JSON表格數據導出Excel

我根據網上文章進行改造,沒有直接照搬人家東西,不需要引入任何插件純原生JS實現 效果圖:        調用代碼: // 列 let column = [ { text: '姓名', key: 'name' }, { text:

原创 JS 導入Excel數據

需要依賴 xlsx.js 插件,插件可自行到官網下載最新依賴   效果圖:     <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JS Excel導入表

原创 HTML轉Canvas轉圖片下載

如題HTML元素轉Canvas再轉圖片然後下載 需要用到插件:html2canvas 可自行到官網下載最新版本   效果圖:    示例代碼: <!doctype html> <html> <head> <meta charset

原创 ES6 WeakSet

WeakSet 類似 WeakMap,weak 表示弱映射, value (弱弱地拿着)而且必須是對象, 意思是 key 不是正式引用,不會阻止垃圾回收, 但只要 key 存在就不會被垃圾回收機制銷燬。   操作方法: ad

原创 ES6 WeakMap

WeakMap 就是 Map ,weak 表示弱映射, key(弱弱地拿着)而且必須是對象, 意思是 key 不是正式引用,不會阻止垃圾回收, 但只要 key 存在就不會被垃圾回收機制銷燬。 只有四個方法: set(key ,

原创 SE6 Set

Set:ES6 新的數據結構,類似數組,但元素唯一 操作方法: add(value) 添成員並返回Set本身 has(value) 通過 鍵 判斷 成員 是否存在 size 返回成員數量 d

原创 eslint-plugin-import踩坑過程

爲什麼用eslint-plugin-import?因爲eslint-config-airbnb-base前置插件就是eslint-plugin-import。 爲什麼用eslint-config-airbnb-base?因爲當前業界最火的E

原创 eslintrc.js基礎配置

官網教程:https://eslint.bootcss.com/docs/user-guide/configuring eslintrc.js基本配置:https://juejin.cn/post/6975078700622544904#h

原创 vite 路徑別名 @ 配置

官網配置教程:https://cn.vitejs.dev/config 路徑別名 @ 有什麼用就不說了網上很多文章,本文重點演示vite + vue3項目配置過程   改造 vite.config.ts 文件 原本樣子:  改造後;可以發

原创 vite.config.ts:下載相關依賴還是報沒有相關聲明錯誤

  解決辦法: 1) 在 src 文件夾內添加一個空的 index.d.ts 文件 2) 然後重啓編輯器   乾淨清爽BUG無了 重啓 / 下載依賴都試過幾次了,還是得新建 index.d.ts 文件。

原创 Gitlab私有npm包構建

前言: 很久沒發博客,時間進入2022年,更加忙碌更加捲,其實平時積攢了不少筆記,但都沒時間轉化爲博客 2022年主要核心是 vue3 + ts 開發,踩過很多坑,躺過很多雷,後續有空會陸續把 vue3 + ts 學習一些值得分享的內容寫出

原创 Vite2.0打包element-plus UI報錯

項目環境:Vite2.0 + Vue3.2 + Typescript + element-plus UI 打包報錯很有可能跟依賴包版本不同而導致出現不同的錯 所以貼出依賴包版本號以供參考:   翻查報錯文件位置瞭解到是element-

原创 vue3 + vuex4 實踐

前言: 本文基於vite2.0 + vue3.2 + Typescript + vuex4 官網:https://vuex.vuejs.org/zh/guide/state.html 之前寫過一篇關於vuex的文章:https://www.