摘要：
刷新頁面時不會觸發組件的 onUnmount 事件。 因為刷新頁面會直接銷毀整個頁面的 DOM 樹和內存中的組件實例，屬于“強制清空”，而非組件正常從 DOM 樹中卸載的流程。 而 onUnmount 的核心是“組件正常卸載（如路由切換、條件渲染移除）時執行”，僅在組件主動脫離 DOM 樹的場景下觸
閱讀全文
posted @ 2025-10-03 21:25
羅毅豪
閱讀(34)
推薦(0)
摘要：
實現防重復提交 1.按鈕置灰和恢復（觸發函數時應馬上置灰，再執行其他邏輯，最后恢復按鈕狀態，否則容易在執行函數的置灰語句前再次觸發函數，可以使用try-finally結構對函數進行改造） 2.前端對請求進行緩存（實現請求最終只有一次的情況） 3.后端對同一接口頻繁調用設置時間間隔 4.提交時前端傳遞
閱讀全文
posted @ 2025-10-03 21:14
羅毅豪
閱讀(8)
推薦(0)
摘要：
原代碼 const commitForm = async () => { btnLoading.value = true; isCommitted.value = true; //過濾出顯示字段的列表 let showFieldsList = []; for (let comp of compLis
閱讀全文
posted @ 2025-09-22 22:44
羅毅豪
閱讀(7)
推薦(0)
摘要：
原代碼為 for (let tab of tabList.value) { const subFormData = subOrderListMap.value[tab.subFormWebUuid]; debugger if (subFormData) { tab.formStatus = "已完成
閱讀全文
posted @ 2025-09-21 10:18
羅毅豪
閱讀(6)
推薦(0)
摘要：
JS之數組直接用include方法和數組轉集合后使用has方法效率比較： 數據量小時差異可忽略，數據量大時 “數組轉集合再用 has” 效率遠高于數組的 includes。 核心原因是兩者的查找原理不同： 1. Array.includes()：本質是遍歷數組逐個比對，時間復雜度為 O(n)，數據越
閱讀全文
posted @ 2025-09-17 16:10
羅毅豪
閱讀(9)
推薦(0)
摘要：
以下是 Map 正確序列化與反序列化的完整代碼示例，包含核心轉換邏輯和驗證步驟： // 1. 定義一個待序列化的 Map（包含不同類型的鍵值） const myMap = new Map([ ['name', '豆包'], [123, '數字鍵'], [true, '布爾值鍵'], [{ id: 1
閱讀全文
posted @ 2025-09-17 16:05
羅毅豪
閱讀(18)
推薦(0)
摘要：
在 Java 的org.apache.commons.lang3.StringUtils工具類中，isNotBlank()和isNotEmpty()是兩個常用的字符串判斷方法，它們的主要區別在于對空白字符（whitespace）的處理上： StringUtils.isNotEmpty(CharSeq
閱讀全文
posted @ 2025-09-13 19:02
羅毅豪
閱讀(11)
推薦(0)
摘要：
需求：變更URL的傳參但不刷新頁面 代碼如下： // 解析URL參數為對象 function getUrlParams() { const params = {}; const search = window.location.search.substring(1); if (search) { s
閱讀全文
posted @ 2025-09-08 10:56
羅毅豪
閱讀(19)
推薦(0)
摘要：
現況：電腦雙網卡，同時連接wifi和網線，運行應用程序需要連接wifi，但是wifi流量用完了，無法上網，而插網線可以上網，同時連接時訪問外網網頁失敗，無法上網。 解決方案1：連wifi + 網線，然后寫個腳本讓.50走wifi，其他走網線 要理解 “連 WiFi + 網線，寫腳本讓.50 走 Wi
閱讀全文
posted @ 2025-09-06 15:47
羅毅豪
閱讀(133)
推薦(0)
摘要：
原代碼為 <van-radio v-for="dict in item.dicData" :key="dict.value" :name="dict.value" :disabled="isCompReadOnly" class="option" > <span class="label">{{ d
閱讀全文
posted @ 2025-08-23 10:51
羅毅豪
閱讀(8)
推薦(0)
摘要：
需求：使用burp抓包，可以看到富文本編輯器中圖片是以base64形式在img標簽內的，那就可以添加onclick=alert(1)來注入xss代碼。 這樣用戶在點擊圖片時就會觸發xss代碼，進行彈窗。若通報發布，那所有的用戶都可以查看到通報內容，如果攻擊者惡意偽造彈窗內容進行釣魚，用戶可能會當真，
閱讀全文
posted @ 2025-08-11 14:33
羅毅豪
閱讀(51)
推薦(0)
摘要：
1.安裝zxing "devDependencies": { "@zxing/library": "^0.21.3", } 2.手機端頁面使用示例（該掃碼功能也可用于PC端掃碼） <template> <div :class="subFormItem ? 'sub-comp' : 'custom-c
閱讀全文
posted @ 2025-07-14 11:21
羅毅豪
閱讀(77)
推薦(0)
摘要：
我們在使用電腦時，經常需要截取多個截圖同時進行對比，可使用Snipaste軟件。 使用方式： F1-截取截圖 F3-固定截圖 雙擊-關閉截圖
閱讀全文
posted @ 2025-07-08 15:48
羅毅豪
閱讀(17)
推薦(0)
摘要：
我寫的原代碼如下： const getBatchFileUrlAddLock = (minioObjectName) => { if (sessionStorage.isGetResUrlReqLocked == 1) { setTimeout(() => { getBatchFileUrlAddL
閱讀全文
posted @ 2025-06-20 10:17
羅毅豪
閱讀(42)
推薦(0)
摘要：
使用|| 使用?? 可看出若a的值為0，只有以??方法為變量提供的默認值的方式是正確的。
閱讀全文
posted @ 2025-06-18 09:02
羅毅豪
閱讀(8)
推薦(0)
摘要：
最近開發時，使用console.log輸出數組，如下圖所示，顯示數組長度是1，但是展開后卻沒有數組項。 根據查詢和分析，了解到： 若對數組輸出后，繼續對數組進行操作，那會影響之前的輸出，出現輸出數組長度不一致的問題。 例如： const userList = [1, 2, 3]; console.l
閱讀全文
posted @ 2025-06-06 14:23
羅毅豪
閱讀(17)
推薦(0)
摘要：
1. 沒有++和--運算符，需要通過+=1和-=1來實現 2. 可使用 int() 函數把字符串轉換為整數 3. 使用 float() 函數可以把字符串轉換為浮點數 4. str() 能把多種數據類型轉換為字符串，包括數字 5. 保留兩位小數（結果為字符串類型），四舍五入，示例： num = 3.1
閱讀全文
posted @ 2025-05-24 14:50
羅毅豪
閱讀(13)
推薦(0)
摘要：
Vue組件常用的import如下： import { ref, computed, toRefs, watch, onMounted, h, nextTick, defineAsyncComponent, reactive, shallowRef, getCurrentInstance, injec
閱讀全文
posted @ 2025-04-15 15:36
羅毅豪
閱讀(28)
推薦(0)
摘要：
由于后端限制不能頻繁請求，所以500ms內的二次請求會返回服務器繁忙，請稍后再試，但是業務需要對同一接口頻繁進行多次請求，因此，可以通過給請求結果增加緩存來解決。 request.js修改：增加adapter配置 import axios from 'axios' import cacheAdapt
閱讀全文
posted @ 2025-04-13 12:53
羅毅豪
閱讀(36)
推薦(0)
摘要：
本代碼通過Vue循環<component>組件時，調用子組件的校驗方法，實現多態，避免修改父組件，增強擴展性。 父組件原代碼： <div v-for="comp in compList"> <template v-if="comp.isShow"> <component :is="compMap[c
閱讀全文
posted @ 2025-04-08 09:55
羅毅豪
閱讀(30)
推薦(0)
摘要：
JS實現監聽對象屬性的變化并獲取變化的屬性： 原代碼： watch( () => formData.value, (newVal, oldVal) => { for (const key in newVal) { if (newVal[key] !== oldVal[key]) { console.
閱讀全文
posted @ 2025-04-07 10:19
羅毅豪
閱讀(145)
推薦(0)
摘要：
我使用 const conditions = [ ...item.value.conditions ]; 拷貝出一個新數組，但是當我修改新數組的元素，原數組也發生了變化，因此我判定擴展運算符為淺拷貝。 修改為深拷貝的方法為： const conditions = JSON.parse(JSON.st
閱讀全文
posted @ 2025-04-06 15:55
羅毅豪
閱讀(31)
推薦(0)
摘要：
原代碼支持多選 <a-tree ref="tree" checkable blockNode v-model:expandedKeys="expandedKeys" :replace-fields="replaceFields" :tree-data="treeData" :load-data="g
閱讀全文
posted @ 2025-03-31 16:08
羅毅豪
閱讀(71)
推薦(0)
摘要：
使用Bandizip壓縮文件： 1.使用Bandizip可以壓縮成tar包，滿足運維部署的要求。 2.使用Bandizip壓縮成zip格式速度快，親測是WinZip打包時間的五分之一。
閱讀全文
posted @ 2025-03-28 14:50
羅毅豪
閱讀(48)
推薦(0)
摘要：
在使用<a-auto-complete>輸入首個漢字時，輸入法總是自動退出，剩下一個英文字母在輸入框，代碼如下： <a-auto-complete v-model:value="formState.name" :allowClear="true" @clear="clearContent" :opt
閱讀全文
posted @ 2025-03-26 10:00
羅毅豪
閱讀(36)
推薦(0)
摘要：
1.給<a-upload>增加accept屬性，accept屬性為這些文件的MIME類型。 <a-tooltip> <template #title>只允許上傳doc(x),xls(x),txt,pdf</template> <a-upload v-model:file-list="fileList
閱讀全文
posted @ 2025-03-24 14:49
羅毅豪
閱讀(173)
推薦(0)
摘要：
Antd之解決<a-table>只選了一行就全部選上的缺陷： 將原<a-table>代碼 <a-table :columns="columns" :data-source="dataSource.list" :row-selection="{ selectedRowKeys: selectedKey
閱讀全文
posted @ 2025-03-11 15:58
羅毅豪
閱讀(65)
推薦(0)
摘要：
1.<template>配置示例 <!-- 表格 start--> <a-table :columns="columns" :data-source="tableData.list" :loading="loading" style="margin-top: 24px" :pagination="f
閱讀全文
posted @ 2025-02-12 16:58
羅毅豪
閱讀(14)
推薦(0)
摘要：
1.去掉皮膚瑕疵-污點修復畫筆 2.把手腳變瘦-液化濾鏡 3.把臉變白-應用圖像-R通道-濾色-不透明度
閱讀全文
posted @ 2025-01-20 19:34
羅毅豪
閱讀(18)
推薦(0)
摘要：
需求：調用通訊錄子組件選人，選完人后返回數據到父組件進一步處理。 1.引用子組件 <org-picker ref="orgPicker" title="請選擇人員" multiple :selected="orgPickerSelected" @handleSelected="selected" t
閱讀全文
posted @ 2024-12-10 16:21
羅毅豪
閱讀(35)
推薦(0)
摘要：
我開發的一個頁面，同時多次使用了同一個組件，但是這個組件一加載就會調用同一個方法，最終同時調用同一接口。 但是我們后端對于同一接口的調用頻率進行了限制，不允許短時間內重復提交，需要在一個時間間隔后提交才能請求成功。 原代碼為： onMounted(() => { const code = item.
閱讀全文
posted @ 2024-11-18 16:23
羅毅豪
閱讀(87)
推薦(0)
摘要：
1.小一寸照片的像素尺寸為260像素(寬) × 378像素(高)，一寸的像素尺寸為295像素(寬) × 413像素(高)，二寸的像素尺寸為413像素(寬) × 626像素(高) 。 2??.藍底照片的顏色參數RGB值為R:67, G:142, B:219。 3.人物頭部距離圖片頂部的背景距離小一些。
閱讀全文
posted @ 2024-10-19 20:26
羅毅豪
閱讀(580)
推薦(0)
摘要：
1. ctrl + shift + p 2. 輸入：open workspace settings(JSON) 3. 添加配置 { "workbench.editor.wrapTabs": true, } 即可。
閱讀全文
posted @ 2024-10-11 09:41
羅毅豪
閱讀(1017)
推薦(0)
摘要：
父組件給子組件傳多個不確定的參數，可以使用v-bind進行傳參。 父組件代碼示例： <template> <component ref="form" :value="value" :disabled="disabled" :is="currentComp" :mode="mode" v-bind="
閱讀全文
posted @ 2024-10-09 11:40
羅毅豪
閱讀(87)
推薦(0)
摘要：
1.開發拍照上傳頁面 - andImgCapture.vue，包含鏡頭翻轉功能 <template> <div> <van-button icon="plus" type="primary" :disabled="disabled" @click.stop="clickCamera" ref="up
閱讀全文
posted @ 2024-09-23 15:41
羅毅豪
閱讀(1441)
推薦(0)
摘要：
1.<template>部分 <a-upload name="file" :customRequest="importExcelData" accept=".xls,.xlsx" class="uploadBtn" :showUploadList="false" > <a-button type="
閱讀全文
posted @ 2024-09-04 09:39
羅毅豪
閱讀(512)
推薦(0)
摘要：
File對象有兩種形態， 在請求時為： 控制臺輸出為： 從formData中獲得fileList對應的File對象，并轉換為base64字符串，再轉換回File對象，代碼示例如下： const fileList = uploadFormData.get("fileList"); console.lo
閱讀全文
posted @ 2024-08-02 16:49
羅毅豪
閱讀(660)
推薦(0)
摘要：
需求：根據判斷當前是PC端還是手機端，給頁面顯示不同的內容。 const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent); const title = ref("服務器錯誤"); const subTitle = re
閱讀全文
posted @ 2024-08-02 16:39
羅毅豪
閱讀(24)
推薦(0)
摘要：
CSS設置頁面背景色為淺灰色，代碼示例如下： .list { background: #ebedf0; height: 100vh; overflow-y: scroll; overflow-x: hidden; } 即可。
閱讀全文
posted @ 2024-07-29 15:54
羅毅豪
閱讀(443)
推薦(0)
摘要：
在這里記錄一下開發過程的一些小要點。 這些小要點暫時無法單獨寫成一篇文章，如果以后有時間可以對單個小要點進行知識擴展，形成文章。 1.<van-tabs>加上sticky屬性，即可實現固定定位。 2.媒體查詢區間左閉右開。 3.普通的時間字符串可用大于小于號比較大小。 4.圖片加載出現404，給im
閱讀全文
posted @ 2024-07-25 17:14
羅毅豪
閱讀(22)
推薦(0)
浙公網安備 33010602011771號