Vue3 + TypeScript + el-input 實現人民幣金額的輸入和顯示

輸入人民幣金額的參數要求：

輸入要求：

  • 通過鍵盤，只允許輸入負號、小數點、數字、退格鍵、刪除鍵、方向左鍵、方向右鍵、Home鍵、End鍵、Tab鍵；
  • 負號只能在開頭；
  • 只保留第一個小數點；
  • 替換全角輸入的小數點，即“。”替換為“.”；
  • 小數點開頭的前面補0；
  • 限制小數點后最多兩位；
  • 去除前導零（非小數的情況下，去除開頭的0）；
  • 通過復制粘貼的，確保粘貼出來的內容符合上述的要求。

顯示要求：

  • 聚焦時 @focus 顯示原始金額數值，如：1234.56；
  • 失焦時?@blur 格式化金額數值，如：￥?1,234.56；
  • 鍵盤輸入?@keydown 按輸入要求過濾內容；
  • 輸入內容?@input?防漏兜底，防止通過粘貼輸入的，按輸入要求過濾內容；
  • 回車時?@keyup.enter.native="$event.target.blur()" 失焦；

方法一：使用?el-input 的?@input 和?@blur

優點：輸入方便，可以自由輸入

缺點：改變原值

如：

輸入的原值為：1234.56

顯示的內容為：￥1,234.56

最終值為：￥1,234.56

示例代碼：

<script setup lang="ts" name="MaterialOut">
import { ref } from "vue";
import { formatInputRMB, formatToRMB, formatRMB } from "@/utils/formatter";// 金額
const total = ref<string>("");
</script><template><!-- 控制輸入：@input="total = formatInputRMB($event)" 控制只能輸入數字、小數點（兩位小數） --><!-- 控制顯示：@blur="total = formatRMB(formatToRMB(total))" 輸入框失去焦點時，將輸入框內容格式化為人民幣格式 --><!-- 控制失焦：@keyup.enter.native="$event.target.blur()" 按回車輸入框失去焦點 --><el-inputv-model="total"@input="total = formatInputRMB($event)"@blur="total = formatRMB(formatToRMB(total))"@keyup.enter.native="$event.target.blur()"placeholder="請輸入金額，按回車確認" />
</template>

?formatter.ts

/*** 格式化輸入人民幣金額* @param val 輸入值* @returns 數字字符串，如：0、123、1234.0、1234.56*/
export const formatInputRMB = (val: string) => {let result = val ?? "";// 格式化輸入的內容result = result// 替換全角輸入的小數點.replace(/。/g, ".")// 只保留數字和小數點.replace(/[^\d.]/g, "")// 小數點開頭的前面補0.replace(/^\./, "0.")// 只保留第一個小數點.replace(/(\..*)\./g, "$1")// 去除前導零，非小數的情況下，去除開頭的0.replace(/^0+(\d)/, "$1")// 限制小數點后最多兩位.replace(/^(\d+\.\d{2})\d+/, "$1");return result;
};/*** 格式化為人民幣金額* @param val 字符串或數字* @param rounding 是否四舍五入（默認 true，若設為 false 則直接截斷）* @returns 數字字符串，如：0.00、1.20、123.04、1234.56*/
export const formatToRMB = (val: string | number | null, rounding: boolean = true) => {let result = String(val || "0.00");// 格式化輸入的內容result = result// 替換全角輸入的小數點.replace(/。/g, ".")// 只保留數字和小數點.replace(/[^\d.]/g, "")// 小數點開頭的前面補0.replace(/^\./, "0.")// 只保留第一個小數點.replace(/(\..*)\./g, "$1")// 去除前導零，非小數的情況下，去除開頭的0.replace(/^0+(\d)/, "$1");// 分割整數部分和小數部分let [integer = "0", decimal = ""] = result.split(".");// 四舍五入處理小數部分if (rounding) {// 四舍五入處理（通過 Number 轉換自動處理）const rounded = Math.round(Number(`${integer}.${decimal}`) * 100) / 100;return rounded.toFixed(2);}// 截斷處理小數部分else {// 截斷并補零decimal = decimal.slice(0, 2).padEnd(2, "0");// 確保整數部分存在integer = integer ?? "0";return `${integer}.${decimal}`;}
};/**** 格式化為帶符號和千分位的人民幣金額* @param val 字符串或數字* @param rounding 是否四舍五入（默認 true，若設為 false 則直接截斷）* @returns 人民幣金額字符串，如：￥0.00、￥1.20、￥123.04、￥1,234.56*/
export const formatRMB = (val: string | number) => {let result = formatToRMB(val);// 添加人民幣符號 ￥，添加千分位 ,result = "￥" + result.replace(/\B(?=(\d{3})+(?!\d))/g, ",");return result;
};

效果：

輸入前

輸入中?

回車確認后

方法二：使用 el-input 的 :formatter 和 :parser

優點：保持原值

缺點：輸入受限，不能自由輸入

如：

輸入的原值為：1234.56

顯示的內容為：￥1,234.56

最終值為：1234.56

示例代碼：

<script setup lang="ts" name="MaterialOut">
import { ref } from "vue";// 存儲原始數值（用于業務邏輯）
const total = ref<number | null>(null);// 格式化顯示金額（用于 input 顯示）
const formatRMB = (value: number | null): string => {if (value === null || isNaN(value)) return "";const valStr = value.toFixed(2);const [integer, decimal] = valStr.split(".");const formattedInteger = integer.replace(/\B(?=(\d{3})+(?!\d))/g, ",");return `￥ ${formattedInteger}.${decimal}`;
};// 解析輸入內容（用于 input 輸入）
const parseRMB = (value: string): string => {// 去除非數字和小數點字符let filtered = value.replace(/[^\d.]/g, "").replace(/(\..*)\./g, "$1");if (filtered === "." || filtered === "") return "";const [integer = "0", decimal] = filtered.split(".");const cleanInteger = integer.replace(/^0+/, "") || "0";const cleanDecimal = decimal ? decimal.slice(0, 2) : "";return cleanDecimal ? `${cleanInteger}.${cleanDecimal}` : cleanInteger;
};// 輸入事件處理
const handleInput = (value: string) => {const parsed = parseRMB(value);total.value = parsed ? parseFloat(parsed) : null;
};
</script><template><el-inputv-model="total":formatter="(val: string) => formatRMB(val ? parseFloat(val) : null)":parser="(val: string) => parseRMB(val)"@input="handleInput"@keyup.enter.native="$event.target.blur()"type="text"placeholder="請輸入金額，按回車確認" />
</template>

效果：

輸入前

?輸入中

回車確認后?

方法三（推薦）：使用 el-input 的 @focus、@blur、@keydown、@input

優點：輸入方便，可以自由輸入，保持原值

缺點：無

<script setup lang="ts" name="MaterialOut">
import { ref } from "vue";// 存儲原始數值（用于業務邏輯）
const total = ref<number | null>(null);// 輸入框內部狀態（帶格式）
const inputValue = ref<string>("");// 處理鍵盤輸入
function handleKeyDown(e: KeyboardEvent) {// 只允許輸入負號、小數點、數字、退格鍵、刪除鍵、方向左鍵、方向右鍵、Home鍵、End鍵、Tab鍵const allowedKeys = ["-","0","1","2","3","4","5","6","7","8","9",".","Backspace","Delete","ArrowLeft","ArrowRight","Home","End","Tab"];// 阻止非法字符輸入if (!allowedKeys.includes(e.key)) {e.preventDefault();return;}const inputEl = e.target as HTMLInputElement;const cursorPos = inputEl.selectionStart || 0;const value = inputValue.value;// 阻止輸入多個小數點if (e.key === "." && value.includes(".")) {e.preventDefault();return;}// 阻止輸入多個負號 或 負號不在開頭if (e.key === "-" && (value.includes("-") || cursorPos !== 0)) {e.preventDefault();return;}// 輔助按鍵，則不阻止，任何時候都允許輸入const assistantKeys = ["Backspace", "Delete", "ArrowLeft", "ArrowRight", "Home", "End", "Tab"];if (assistantKeys.includes(e.key)) {return;}// 如果已有小數點，并且光標在小數點后，限制最多兩位if (value.includes(".")) {const decimalIndex = value.indexOf(".");const parts = value.split(".");// 僅當光標在小數點之后時才限制輸入if (parts[1] && parts[1].length >= 2 && cursorPos > decimalIndex) {e.preventDefault();}}
}// 處理輸入內容（防漏兜底，防止不是通過鍵盤輸入，而是通過粘貼輸入的）
function handleInput(value: string) {// 過濾輸入的內容let filtered = value// 替換全角輸入的小數點.replace(/。/g, ".")// 只保留負號、數字和小數點.replace(/[^-\d.]/g, "")// 小數點開頭的前面補0.replace(/^\./, "0.")// 只保留第一個小數點.replace(/(\..*)\./g, "$1")// 負號只能在開頭.replace(/(\--*)\-/g, "$1")// 去除前導零（非小數的情況下，去除開頭的0）.replace(/^0+(\d)/, "$1")// 限制小數點后最多兩位.replace(/^(\d+\.\d{2})\d+/, "$1");// 負號只能在開頭，等效于 replace(/(\--*)\-/g, "$1")// if (filtered.startsWith("-")) {//   const rest = filtered.slice(1).replace(/[^\d.]/g, "");//   filtered = "-" + rest;// } else {//   filtered = filtered.replace(/[^\d.]/g, "");// }/*// 處理小數點const parts = filtered.split(".");// 只保留第一個小數點，等效于 replace(/(\..*)\./g, "$1")if (parts.length > 2) {filtered = parts[0] + "." + parts.slice(1).join("");}// 限制小數點后最多兩位if (parts[1]) {// 限制小數部分最多兩位，等效于 replace(/^(\d+\.\d{2})\d+/, "$1")parts[1] = parts[1].slice(0, 2);filtered = parts[0] + "." + parts[1];}*/// 如果過濾后為空 或 無效內容，則清空 totalif (!filtered || filtered === "-" || filtered === "." || filtered === "-.") {total.value = null;} else {total.value = parseFloat(filtered);}inputValue.value = filtered;
}// 獲得焦點時顯示原始值
function handleFocus() {inputValue.value = total.value?.toString() || "";
}// 失去焦點后格式化顯示為人民幣格式
function handleBlur() {const rawValue = inputValue.value;if (!rawValue) {inputValue.value = "";total.value = null;return;}const num = parseFloat(rawValue);if (isNaN(num)) {inputValue.value = "";total.value = null;return;}total.value = num;const [integerPart, decimalPart = "00"] = Math.abs(num).toFixed(2).split(".");// 千分位格式化const formattedInteger = integerPart.replace(/\B(?=(\d{3})+(?!\d))/g, ",");const sign = num < 0 ? "-" : "";// 格式化為人民幣格式inputValue.value = `￥ ${sign}${formattedInteger}.${decimalPart}`;
}
</script><template><!-- 控制輸入：@keydown="handleKeyDown" 和 @input="handleInput" --><!-- 控制顯示：@focus="handleFocus"和 @blur="handleBlur" --><!-- 控制失焦：@keyup.enter.native="$event.target.blur()" 按回車輸入框失去焦點 --><el-inputv-model="inputValue"@focus="handleFocus"@blur="handleBlur"@keydown="handleKeyDown"@input="handleInput"@keyup.enter.native="$event.target.blur()"placeholder="請輸入金額，按回車確認" />
</template>

效果：

?輸入前

輸入中

回車確認后

將這部分邏輯封裝成一個可復用的 Vue Composition API Hook

? 封裝目標

我們將以下功能抽離為一個?useInputRMB()?Hook：

功能描述
輸入限制鍵盤攔截非法字符（數字、負號、小數點）
全角支持支持?。?和?－?自動轉換
粘貼支持Ctrl+V?/ 鼠標右鍵粘貼內容自動過濾
回車失焦按下 Enter 鍵后輸入框失去焦點
數據模型返回?inputValue?用于綁定到?<el-input>
數值存儲返回?total?表示原始 `number
失焦格式化顯示為?￥ -1,234.56?格式

? 完整 Hook 實現：useInputRMB.ts

你可以將下面這段代碼保存為?src/hooks/useInputRMB.ts?文件：

import { ref } from "vue";export function useInputRMB() {// 存儲原始數值（用于業務邏輯）const total = ref<number | null>(null);// 輸入框內部狀態（帶格式）const inputValue = ref<string>("");// 處理鍵盤輸入function handleKeyDown(e: KeyboardEvent) {// 只允許輸入負號、小數點、數字、退格鍵、刪除鍵、方向左鍵、方向右鍵、Home鍵、End鍵、Tab鍵const allowedKeys = ["-","0","1","2","3","4","5","6","7","8","9",".","Backspace","Delete","ArrowLeft","ArrowRight","Home","End","Tab"];// 阻止非法字符輸入if (!allowedKeys.includes(e.key)) {e.preventDefault();return;}const inputEl = e.target as HTMLInputElement;const cursorPos = inputEl.selectionStart || 0;const value = inputValue.value;// 阻止輸入多個小數點if (e.key === "." && value.includes(".")) {e.preventDefault();return;}// 阻止輸入多個負號 或 負號不在開頭if (e.key === "-" && (value.includes("-") || cursorPos !== 0)) {e.preventDefault();return;}// 輔助按鍵，則不阻止，任何時候都允許輸入const assistantKeys = ["Backspace", "Delete", "ArrowLeft", "ArrowRight", "Home", "End", "Tab"];if (assistantKeys.includes(e.key)) {return;}// 如果已有小數點，并且光標在小數點后，限制最多兩位if (value.includes(".")) {const decimalIndex = value.indexOf(".");const parts = value.split(".");// 僅當光標在小數點之后時才限制輸入if (parts[1] && parts[1].length >= 2 && cursorPos > decimalIndex) {e.preventDefault();}}}// 處理輸入內容（防漏兜底，防止不是通過鍵盤輸入，而是通過粘貼輸入的）function handleInput(value: string) {// 過濾輸入的內容let filtered = value// 替換全角輸入的小數點.replace(/。/g, ".")// 只保留負號、數字和小數點.replace(/[^-\d.]/g, "")// 小數點開頭的前面補0.replace(/^\./, "0.")// 只保留第一個小數點.replace(/(\..*)\./g, "$1")// 負號只能在開頭.replace(/(\--*)\-/g, "$1")// 去除前導零（非小數的情況下，去除開頭的0）.replace(/^0+(\d)/, "$1")// 限制小數點后最多兩位.replace(/^(\d+\.\d{2})\d+/, "$1");// 負號只能在開頭，等效于 replace(/(\--*)\-/g, "$1")// if (filtered.startsWith("-")) {//   const rest = filtered.slice(1).replace(/[^\d.]/g, "");//   filtered = "-" + rest;// } else {//   filtered = filtered.replace(/[^\d.]/g, "");// }/*// 處理小數點const parts = filtered.split(".");// 只保留第一個小數點，等效于 replace(/(\..*)\./g, "$1")if (parts.length > 2) {filtered = parts[0] + "." + parts.slice(1).join("");}// 限制小數點后最多兩位if (parts[1]) {// 限制小數部分最多兩位，等效于 replace(/^(\d+\.\d{2})\d+/, "$1")parts[1] = parts[1].slice(0, 2);filtered = parts[0] + "." + parts[1];}*/// 如果過濾后為空 或 無效內容，則清空 totalif (!filtered || filtered === "-" || filtered === "." || filtered === "-.") {total.value = null;} else {total.value = parseFloat(filtered);}inputValue.value = filtered;}// 獲得焦點時顯示原始值function handleFocus() {inputValue.value = total.value?.toString() || "";}// 失去焦點后格式化顯示為人民幣格式function handleBlur() {const rawValue = inputValue.value;if (!rawValue) {inputValue.value = "";total.value = null;return;}const num = parseFloat(rawValue);if (isNaN(num)) {inputValue.value = "";total.value = null;return;}total.value = num;const [integerPart, decimalPart = "00"] = Math.abs(num).toFixed(2).split(".");// 千分位格式化const formattedInteger = integerPart.replace(/\B(?=(\d{3})+(?!\d))/g, ",");const sign = num < 0 ? "-" : "";// 格式化為人民幣格式inputValue.value = `￥ ${sign}${formattedInteger}.${decimalPart}`;}return {inputValue,total,handleKeyDown,handleInput,handleBlur,handleFocus};
}

? 在組件中使用這個 Hook，使用方式一，解構使用

組件?MaterialOut.vue?文件如下：

<script setup lang="ts" name="MaterialOut">
import { useInputRMB } from "@/hooks/useInputRMB";const { inputValue, total, handleKeyDown, handleInput, handleBlur, handleFocus } = useInputRMB();
</script><template><!-- 控制輸入：@keydown="handleKeyDown" 和 @input="handleInput" --><!-- 控制顯示：@focus="handleFocus"和 @blur="handleBlur" --><!-- 控制失焦：@keyup.enter.native="$event.target.blur()" 按回車輸入框失去焦點 --><el-inputv-model="inputValue"@focus="handleFocus"@blur="handleBlur"@keydown="handleKeyDown"@input="handleInput"@keyup.enter.native="$event.target.blur()"placeholder="請輸入金額，按回車確認" />
</template>

?? 效果：

輸入前

輸入中

回車確認后

? 在組件中使用這個 Hook，使用方式二，直接定義使用

組件?MaterialOut.vue?文件如下：

<script setup lang="ts" name="MaterialOut">
import { useInputRMB } from "@/hooks/useInputRMB";const inputRMBHooks = useInputRMB();
</script><template><!-- 控制輸入：@keydown="handleKeyDown" 和 @input="handleInput" --><!-- 控制顯示：@focus="handleFocus"和 @blur="handleBlur" --><!-- 控制失焦：@keyup.enter.native="$event.target.blur()" 按回車輸入框失去焦點 --><!-- 這里注意，inputValue 需要 .value --><el-inputv-model="inputRMBHooks.inputValue.value"@focus="inputRMBHooks.handleFocus"@blur="inputRMBHooks.handleBlur"@keydown="inputRMBHooks.handleKeyDown"@input="inputRMBHooks.handleInput"@keyup.enter.native="$event.target.blur()"placeholder="請輸入金額，按回車確認" />
</template>

直接原因

useInputRMB()?返回的?inputValue?本身是一個?ref?對象，而?inputRMBHooks?是一個普通對象（非響應式對象）。這種情況下，Vue 的模板無法自動解包嵌套在普通對象中的?ref，所以需要手動通過?.value?訪問。

typescript

復制

下載

// 假設 useInputRMB 的實現類似這樣：
const useInputRMB = () => {const inputValue = ref(""); // inputValue 是一個 refreturn {inputValue, // 將 ref 直接暴露出去};
};

為什么需要?.value？

  1. 當?ref?被包裹在普通對象中時：

    • 如果?inputRMBHooks?是一個普通對象（如?const inputRMBHooks = { inputValue: ref('') }），模板不會自動解包內部的?ref。

    • 此時必須通過?inputRMBHooks.inputValue.value?訪問值。

  2. 如果?inputRMBHooks?是響應式對象（如?reactive）：

    • Vue 會自動解包第一層的?ref，此時無需?.value。

    • 但你的代碼中?inputRMBHooks?可能是普通對象，或?inputValue?被嵌套在更深層。

驗證方法

檢查?useInputRMB?的實現：

  • 如果它返回的是?reactive?包裹的對象，且?inputValue?是?ref，模板中應該不需要?.value。

  • 如果返回的是普通對象，則需要?.value。

解決方案（可選）

如果希望省略?.value，可以將?inputRMBHooks?轉為響應式對象：

typescript

復制

下載

const inputRMBHooks = reactive(useInputRMB());

然后在模板中直接使用?v-model="inputRMBHooks.inputValue"（無需?.value）。

總結

你的代碼中需要?.value，是因為?inputRMBHooks?是一個普通對象，且?inputValue?是?ref，而 Vue 不會自動解包普通對象內部的?ref。通過?.value?顯式訪問是必要的。

? 在組件中使用這個 Hook，使用方式三，reactive定義使用

組件?MaterialOut.vue?文件如下：

?
<script setup lang="ts" name="MaterialOut">
import { reactive } from "vue";
import { useInputRMB } from "@/hooks/useInputRMB";const inputRMBHooks = reactive(useInputRMB());
</script><template><!-- 控制輸入：@keydown="handleKeyDown" 和 @input="handleInput" --><!-- 控制顯示：@focus="handleFocus"和 @blur="handleBlur" --><!-- 控制失焦：@keyup.enter.native="$event.target.blur()" 按回車輸入框失去焦點 --><el-inputv-model="inputRMBHooks.inputValue"@focus="inputRMBHooks.handleFocus"@blur="inputRMBHooks.handleBlur"@keydown="inputRMBHooks.handleKeyDown"@input="inputRMBHooks.handleInput"@keyup.enter.native="$event.target.blur()"placeholder="請輸入金額，按回車確認" />
</template>?

本文來自互聯網用戶投稿，該文觀點僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。
如若轉載，請注明出處：http://www.pswp.cn/web/81456.shtml
繁體地址，請注明出處：http://hk.pswp.cn/web/81456.shtml
英文地址，請注明出處：http://en.pswp.cn/web/81456.shtml

如若內容造成侵權/違法違規/事實不符，請聯系多彩編程網進行投訴反饋email:809451989@qq.com，一經查實，立即刪除！

相關文章

方正字庫助力華為，賦能鴻蒙電腦打造全場景字體解決方案

方正字庫助力華為，賦能鴻蒙電腦打造全場景字體解決方案

2025年5月19日&#xff0c;搭載華為鴻蒙操作系統的鴻蒙電腦&#xff0c;面向用戶推出集AI智能、互聯流暢、安全保障和精致體驗于一體的全新辦公系統。作為鴻蒙生態核心字體服務商&#xff0c;方正字庫為此次提供了全面的系統字體支持&#xff0c;涵蓋中文、西文及符號三大類字庫…
閱讀更多...
PHPStudy 一鍵式網站搭建工具的下載使用

PHPStudy 一鍵式網站搭建工具的下載使用

目錄 一、下載 PHPStudy二、安裝步驟三、基本使用方法3.1 創建網站3.2 管理數據庫3.3 軟件管理3.4 自動啟動3.5 配置管理 四、注意事項和進階使用4.1 注意事項4.2 進階使用 背景&#xff1a; 我們在學習和工作中&#xff0c;經常會遇到各種需要自己搭建環境的場景&#xff0c;這…
閱讀更多...
java中的線程安全的集合

java中的線程安全的集合

1.ConcurrentHashMap。 key,value結構。 jdk1.7通過分段鎖保證不同段同時操作是線程安全的&#xff0c;但并發不足&#xff0c;jdk1.8通過node節點鎖和CAS保證并發安全。不同node節點可以并發讀寫。通過它的computer,computerIfAbsent,等可以保證原子更新value。ifAbsent表示有…
閱讀更多...
MySQL問題：MySQL中使用索引一定有效嗎？如何排查索引效果

MySQL問題：MySQL中使用索引一定有效嗎？如何排查索引效果

不一定有效&#xff0c;當查詢條件中不包含索引列或查詢條件復雜且不匹配索引順序 對于一些小表&#xff0c;MySQL可能選擇全表掃描而非使用索引&#xff0c;因為全表掃描的開銷可能更小 最終是否用上索引是根據MySQL成本計算決定的&#xff0c;評估CPU和I/O成本 排查索引效…
閱讀更多...
使用vscode MSVC CMake進行C++開發和Debug

使用vscode MSVC CMake進行C++開發和Debug

使用vscode MSVC CMake進行C開發和Debug 前言軟件安裝安裝插件構建debuug方案一debug方案二其他 前言 一般情況下我都是使用visual studio來進行c開發的&#xff0c;但是由于python用的是vscode&#xff0c;所以二者如果統一的話能稍微提高一點效率。 軟件安裝 需要安裝的軟…
閱讀更多...
【后端高階面經：消息隊列篇】29、Kafka高性能探秘：零拷貝、順序寫與分區并發實戰

【后端高階面經：消息隊列篇】29、Kafka高性能探秘：零拷貝、順序寫與分區并發實戰

一、 順序寫入：磁盤性能的極致挖掘 Kafka的高性能本質上源于對磁盤順序訪問的深度優化。 傳統隨機寫入的磁盤操作需要磁頭頻繁尋道，機械硬盤的隨機寫性能通常僅為100IOPS左右，而Kafka通過追加日志（Append-Only Log）模式，將所有消息按順序寫入分區文件，使磁盤操作轉化為…
閱讀更多...
AI預測3D新模型百十個定位預測+膽碼預測+去和尾2025年5月27日第90彈

AI預測3D新模型百十個定位預測+膽碼預測+去和尾2025年5月27日第90彈

從今天開始&#xff0c;咱們還是暫時基于舊的模型進行預測&#xff0c;好了&#xff0c;廢話不多說&#xff0c;按照老辦法&#xff0c;重點8-9碼定位&#xff0c;配合三膽下1或下2&#xff0c;殺1-2個和尾&#xff0c;再殺6-8個和值&#xff0c;可以做到100-300注左右。 (1)定…
閱讀更多...
Git 初次推送遠程倉庫

Git 初次推送遠程倉庫

Git 初次推送遠程倉庫&#xff08;完整實戰版&#xff09; —— 涵蓋重命名分支、強制合并、沖突解決等高頻場景 &#x1f525; 核心流程圖 初始化 → 關聯遠程 → 提交代碼 → 處理分支沖突 → 成功推送 1. 基礎操作&#xff08;全新倉庫&#xff09; # 初始化 cd /your/pr…
閱讀更多...
Pluto實驗報告——基于FM的音頻信號傳輸并解調恢復

Pluto實驗報告——基于FM的音頻信號傳輸并解調恢復

目錄 一、實驗目的 ................................ ................................ ................................ .................. 3 二、實驗內容 ................................ ................................ ................................ ......…
閱讀更多...
輸出數據OutputFormat案例

輸出數據OutputFormat案例

輸出數據OutputFormat 案例&#xff1a; www.atguigu.com www.atguigu.com www.atguigu.com www.hao123.com www.shouhu.com www.baidu.com www.atguigu.com www.qq.com www.gaga.com www.qinghua.com www.sogou.com www.baidu.com www.alibaba.com …
閱讀更多...
STM32與ESP32的區別

STM32與ESP32的區別

STM32與ESP32都是當前電子行業中廣泛使用的微控制器芯片&#xff0c;但二者在架構、功能、應用領域以及開發生態上均存在顯著差異。需要高度實時響應和低功耗的系統通常適合STM32&#xff0c;而需要網絡連接和便捷無線通訊的物聯網應用通常更適合ESP32。 一、架構與性能 STM32…
閱讀更多...
YOLOv11改進 | Neck篇 | 雙向特征金字塔網絡BiFPN助力YOLOv11有效漲點

YOLOv11改進 | Neck篇 | 雙向特征金字塔網絡BiFPN助力YOLOv11有效漲點

YOLOv11改進 | Neck篇 | 雙向特征金字塔網絡BiFPN助力YOLOv11有效漲點 引言 目標檢測領域的最新進展表明，特征金字塔網絡（FPN）的設計對模型性能具有決定性影響。本文詳細介紹如何將**雙向特征金字塔網絡（BiFPN）**集成到YOLOv11的Neck部分，通過改進的多尺度特征融合機制…
閱讀更多...
Python后端框架新星Robyn：性能與開發體驗的雙重革命

Python后端框架新星Robyn：性能與開發體驗的雙重革命

引言：Python后端框架的進化之路 在Web開發領域，Python生態長期被Flask、Django等經典框架主導。隨著異步編程需求的增長和高并發場景的普及，開發者對框架性能提出了更高要求。2023年，一款名為Robyn的新型Web框架橫空出世，以其獨特的Rust底層架構和優雅的Python API設計，…
閱讀更多...
ADS學習筆記(三) 瞬態仿真

ADS學習筆記(三) 瞬態仿真

參考書籍:見資源綁定,書籍3.4 瞬態仿真,書籍鏈接: https://pan.baidu.com/s/1pjw8p7r3-1x8qcC1-hljFQ?pwd4v79 提取碼: 4v79 本文為對實驗內容的補充 瞬態仿真放大倍數與交流仿真不一致 為什么對同一個BJT電路進行交流信號仿真和進行瞬態仿真,得出交流信號仿真的放大倍數是3.…
閱讀更多...
Flask 會話管理：從原理到實戰，深度解析 session 機制

Flask 會話管理：從原理到實戰，深度解析 session 機制

1、Flask中session 的實現原理&#xff1a;服務器與客戶端的協作 HTTP 協議是無狀態的——服務器無法區分兩次請求是否來自同一用戶。這意味著&#xff0c;用戶登錄后跳轉到其他頁面時&#xff0c;服務器會“忘記”用戶身份。 為解決這一問題&#xff0c;Web 開發中引入了會話…
閱讀更多...
學習STC51單片機16（芯片為STC89C52RCRC）

學習STC51單片機16（芯片為STC89C52RCRC）

每日一言 那些讓你喘不過氣的日子&#xff0c;正是蛻變的開始。 串口編程寄存器分析&#xff08;紅色框里面的這個是串口助手里面生成的波特率初始化函數哈&#xff09; 我們就根據以上的寄存器分析&#xff0c;因為這個是配置波特率的需要的寄存器 PCON smod 0 就是PCON的bit…
閱讀更多...
crud方法命名示例

crud方法命名示例

以下是基于表名dste_project_indicator&#xff08;項目指標表&#xff09;的完整命名示例&#xff0c;覆蓋各類增刪改查場景&#xff1a; 1. 表名與實體類映射 // 表名&#xff1a;dste_project_indicator // 實體類&#xff1a;DsteProjectIndicatorEntity public class Ds…
閱讀更多...
AI時代新詞-人工智能生成內容（AIGC）

AI時代新詞-人工智能生成內容（AIGC）

一、什么是人工智能生成內容&#xff08;AIGC&#xff09;&#xff1f; 人工智能生成內容&#xff08;Artificial Intelligence Generated Content&#xff0c;簡稱AIGC&#xff09;是指利用人工智能技術生成的各種形式的內容&#xff0c;包括文字、圖像、音頻和視頻等。AIGC的…
閱讀更多...
英語六級-閱讀篇

英語六級-閱讀篇

目錄 2023年12月大學英語真題&#xff08;二&#xff09; 十五選十&#xff08;Section A&#xff09; 單詞表 短語表 譯文 Passage Two&#xff08;Section C&#xff09; 單詞表 短語表 譯文 簡介&#xff1a;其實我總結這篇文章就是平時記憶該閱讀文章單詞中出現的…
閱讀更多...
Python 爬蟲開發

Python 爬蟲開發

文章目錄 1. 常用庫安裝2. 基礎爬蟲開發2.1. 使用 requests 獲取網頁內容2.2. 使用 BeautifulSoup 解析 HTML2.3. 處理登錄與會話 3. 進階爬蟲開發3.1. 處理動態加載內容&#xff08;Selenium&#xff09;3.2. 使用Scrapy框架3.3. 分布式爬蟲&#xff08;Scrapy-Redis&#xff…
閱讀更多...
最新文章

Copyright @ 2022~2023