鍓嶈█鍦╒ue3涓紝鎴戜滑缁忓父闇€瑕佺敤鍒板緢澶歨ook馃敡宸ュ叿搴撱€傪煈ㄢ€嶐煆湰绔犱粙缁嶅浣曚紭闆呯殑瀹炵幇useMap锛屽紑鍚簿鍝佷箣璺€傪煈忔杩庡ぇ瀹朵綋楠屼紭璐ㄧ殑vue3-hooks-plus瀹岀編鏀寔ts銆傪煉讳綋楠屽湴鍧€瀹炵幇鍘熺悊Map瀵硅薄鎯冲繀澶у閮戒笉闄岀敓锛岄偅涔堝湪Vue3涓浣曚紭闆呯殑浣跨敤鍛紵1.棣栧厛瑕佹湁Map馃憞鍙互浼犲叆鍒濆€硷紝澧炲垹鏌ユ煡淇敼閲嶇疆娓呯┖馃専鍝嶅簲寮?锛屾棦鐒剁敤鐨勬槸Vue3锛岄偅褰撶劧瑕佸搷搴斿紡浜嗭紒constinitialMap=鍒濆鍊?newMap(initialValue):newMap()conststate=ref(initialMap)asRef>濡傛灉鏈夊垵鍊硷紝璧嬪垵鍊硷紝鍚﹀垯缁欑┖Map銆傝繖閲屾湁鏈嬪弸闂簡锛屼粈涔堟槸K鍜孴锛燄煈囧綋鐒舵槸鏀寔ts鐨勶紝涓嶆噦ts鐨勬湅鍙嬭刀蹇畨鎺掍竴涓嬶紝璁﹙ue3浣跨敤璧锋潵寰楀績搴旀墜銆?.缂栧啓ts绫诲瀷鏂囦欢typeMapValue=IterabletypeActions={set:(key:K,value:T)=>voidget:(閿細K)=>T|undefinedremove:(key:K)=>voidhas:(key:K)=>booleanclear:()=>voidsetAll:(newMap:MapValue)=>voidreset:()=>void}杩欓噷MapValue鐨勫垵濮嬪€奸噰鐢ㄤ簡ES6鍐呯疆鐨処terable绫诲瀷锛屾垜浠笇鏈涘垵濮嬪€兼槸鍙鐨勩€侹鍜孴鍒嗗埆浠ｈ〃Map鐨刱ey鍜寁alue銆?.鍐欓挬瀛愬嚱鏁皍seMap(initialValue?:MapValue){......return[state,markRaw(actions)]}state鏄痬ap鐨勫璞★紝action鏄鍦板浘鐨勬搷浣淏ehavior銆俶arkRaw闃叉瀹冩垚涓轰唬鐞嗗璞°€備粠'vue'瀵煎叆{ref,Ref,markRaw}typeMapValue=IterabletypeActions={set:(key:K,value:T)=>voidget:(key:K)=>T|undefinedremove:(key:K)=>voidhas:(key:K)=>booleanclear:()=>voidsetAll:(newMap:MapValue)=>voidreset:()=>void}functionuseMap(initialValue?:MapValue):[Ref>,Actions]functionuseMap(initialValue?:MapValue){constinitialMap=initialValue?newMap(initialValue):newMap()conststate=ref(initialMap)asRef>constactions:Actions={set:(key,value)=>{鐘舵€?value.set(key,value)},get:(key)=>{returnstate.value.get(key)},remove:(key)=>{state.value.delete(key)},鏈夛細(key)=>state.value.has(key),娓呴櫎:()=>;state.value.clear(),setAll:(newMap)=>{state.value=newMap(newMap)},reset:()=>(state.value=initialMap),}return[state,markRaw(鍔ㄤ綔)]}exportdefaultuseMappostscript鉀斤笍鍔犳补锛屾棭鏃ユ垚涓哄法浜?/p>
