@前端

動態 列表
@viewweiwu

Ant Design 二次封裝 Amiya 發佈啦~🎉🎉🎉

什麼是 amiya amiya 是一個組件庫,是對Ant Design的二次封裝,提供頁面級別的組件。 文檔地址 它有什麼特點? 表單只讀模式 默認的 antd 只對少數組件支持 readonly 模式,而 disabled 模式會把 placeholder 顯示出來,且有可能展示不完整。 所以 amiya 為每一種表單類型,提供 readonly 模式,去除默認的圖標符號,變更背景顏色於文字顏色

viewweiwu 頭像

@viewweiwu

昵稱 viewweiwu

@viewweiwu

100 左右實現查詢表格?真的假的?一起來體驗一下 Amiya 的魅力。

“老哥,聽説你寫的頁面挺多的,我這兒有一個頁面,你覺得你需要多少代碼?” “我看看,也還行吧,不就是個查詢表格嘛,現在大家都用 ProComponent 了,用那個寫一下很快的。我想想,差不多 200 行左右就可以了吧。” “那個呀,我知道,官方的二次封裝組件庫,200 行就可以了嗎?嗯,可以。等等,你説的代碼是否包含了操作按鈕?” “操作按鈕?是指你圖上的 【新增】【詳情】這些按鈕嗎?” “是

viewweiwu 頭像

@viewweiwu

昵稱 viewweiwu

@invalidnull

關於 Angular 應用 Components 和 Directives 的實例化問題

同 Angular Module 不同,Angular Components 和 Directives 要實例化多次,每個出現在 HTML template 中的 markup 都會對應一次實例化。 此外,這些項的作用域也限定在它們被導入的 NgModule中,以防止兩個組件使用相同的選擇器時發生命名衝突。由於依賴注入(DI)行為的這種差異,需要區分一個包含組件和指令的 NgModule 和一個包

invalidnull 頭像

@invalidnull

昵稱 註銷

@woxiaomaoshihuaihuai

vue動態組件綁定動態屬性和方法的小tips

當使用多 tab 內容頁時,動態組件是一件非常好用的利器。但是循環動態組件會有個問題,那就是不同組件綁定不同的屬性值和方法,全部寫在組件內固然是一種方法,就是不方便管理和查看,所以以下是單獨聲明的技巧小 tips。 切換的tabs常量 const TABS = [ { label: 'tab1', compo: 'RankingList', props: [

woxiaomaoshihuaihuai 頭像

@woxiaomaoshihuaihuai

昵稱 phoenixhg

@wei4118268_5df1ce05d1877

[vue-cli3/element-plus] 從菜單渲染淺談動態渲染Vue組件的問題

1. 關於Element-plus的菜單渲染問題 跨過了Element-UI,終於來到了Element-plus。又回到了一個老問題,menu的渲染。 創建一個menu數組,利用v-for來渲染數組,生成menu,非常常規的操作。但是操作的過程中,出現了一個小問題,就是關於icon的渲染。 我們知道,在Element-plus中,渲染一個帶圖標的菜單項,是這麼搞的: el-menu-i

wei4118268_5df1ce05d1877 頭像

@wei4118268_5df1ce05d1877

昵稱 wei4118268

@zxl20070701

從零開始搭建 Vue3 組件庫開發環境

搭建開發環境 Vite初始化 新建一個空的文件夾,比如叫 Vue3UI ,然後使用命令行在此文件夾下使用npm初始化: npm init 回車後,我們再安裝vite(我們這裏選擇使用Vite進行打包,使用別的也類似): npm install --save-dev vite 根目錄創建 index.html 文件,裏面內容如下: !DOCTYPE html html lang="zh-cn"

zxl20070701 頭像

@zxl20070701

昵稱 zxl20070701

@invalidnull

使用瀏覽器的 Local Storage 真的安全嗎?

LocalStorage 是一個 HTML5 網絡存儲對象,用於將數據存儲在客户端——即本地,在用户的計算機上。 本地存儲的數據沒有到期日期,並且會一直存在,直到被刪除。 (相比之下,會話存儲是另一個 HTML5 網絡存儲 API,它會在瀏覽器關閉時刪除存儲的數據。) 本地存儲是純 JavaScript。 同樣,雖然它仍然在用户的設備上生成純文本文檔,但本地存儲也允許存儲多達 5MB 的數據(與

invalidnull 頭像

@invalidnull

昵稱 註銷

@chenxiang_594a1cea112c2

ExpiredStorage-給localstroage增加超時功能 源碼解讀

https://www.npmjs.com/package... 這個庫拓展了localStroage。在設置item的時候,會另外再設置一個key用來存儲過期時間。當在取數據的時候判斷是否過期並且remove元素。 用法 expiredStorage = new ExpiredStorage(); // 60秒後過期 expiredStorage.setItem("test", "fo

chenxiang_594a1cea112c2 頭像

@chenxiang_594a1cea112c2

昵稱 阿古達木

@zhuyunbo

瀏覽器存儲及JavaScript重寫LocalStorage方法實現瀏覽器本地存儲設置時間問題

最近遇到了用户登錄信息本地存儲的問題,所以需要對瀏覽器的localStorage的存儲時間進行設置,因此重寫localStorage方法並在此記錄。 瀏覽器幾個存儲總結: localStorage保存的數據(大小5M左右),以“鍵值對”的形式長期存在。也就是説,每一項數據都有一個鍵名和對應的值,所有的數據都是以文本格式保存。保存的數據沒有過期時間,直到手動去除。 sessionStorage

zhuyunbo 頭像

@zhuyunbo

昵稱 很白的小白

@gracetangyi

瀏覽器存儲

瀏覽器存儲 瀏覽器存儲包括兩種方式,分別是 sessionStorage、localStorage 對於每個源(origin)sessionStorage 和 localStorage 使用不同的 Storage 對象——獨立運行和控制 關於兼容性:部分瀏覽器不可用 sessionStorage 為每一個給定的源維持一個獨立的存儲區域,該存儲區域在頁面會話期間可用 只要瀏覽器處於

gracetangyi 頭像

@gracetangyi

昵稱 Grace糖衣

@beckyyyy

cookie、session、web storage

cookie與session的區別 首先,使用cookie和session的目的都是為了跟蹤記錄用户狀態,因為http協議是無狀態的協議,而某些場景服務端需要記錄用户的狀態,如購物車,需要來識別具體的用户,服務端就為特定的用户創建特定的session,用於標識並跟蹤用户; 其次,cookie和session都是會話技術,session保存在服務端,cookie保存在客户端,服務端無法知道請求對應哪

beckyyyy 頭像

@beckyyyy

昵稱 beckyyyy

@ning_643b67be37ac3

3分鐘搞定:瀏覽器本地存儲 Web Storage

寫在前面 瀏覽器本地存儲包括兩個對象:sessionStorage 和 localStorage,它們都是 Storage 的實例對象。 window.localStorage instanceof Storage; // true Web Storage 的基本使用 查-訪問數據:getItem() 方法。 增改-添加、修改數據:setItem() 方法。 刪-刪除數據:removeItem()

ning_643b67be37ac3 頭像

@ning_643b67be37ac3

昵稱 麒寧

@refanbanzhang

當從localStorage中獲取數據時,如何做異常處理?

提出問題 下面的代碼在有初始值的情況下,能夠工作的很好,但是當localStorage中存在非法的數據時就會拋出異常,如果你的程序沒有做好異常處理,就會崩潰。 const todosStr = localStorage.getItem('todos') const todos = JSON.parse(todosStr) 分析問題 能夠拋出異常的位置在JSON.parse,當JSON.parse解

refanbanzhang 頭像

@refanbanzhang

昵稱 熱飯班長

@liuyuxuan6666

解決lodash由於依賴錯誤導致無法啓動的問題

目錄 問題描述 嘗試的解決辦法 真正的解決辦法 結論 一、 問題描述 一個很久沒接觸的老項目,前兩天想看一下里面一個功能,結果前端起不來了。 先上報錯: Error: node_modules/@types/lodash/common/object.d.ts:1026:46 - error TS1005: '?' expected. 1026 : K extend

liuyuxuan6666 頭像

@liuyuxuan6666

昵稱 LYX6666

@jianrendechaomian_czry72

Cocos獨立遊戲開發框架之對象池:缺對象你就new一個

引言 本系列是《8年主程手把手打造Cocos獨立遊戲開發框架》,歡迎大家關注分享收藏訂閲。 我們遊戲開發中的對象池裏的對象並非小夥伴們想的現實中的對象,現實中的對象需要大家不斷地努力,才能如願以償。下面我們來探討一下游戲開發中的對象池管理,它可以更有效地管理遊戲對象的創建和回收。 本文源碼和源工程在文末獲取,小夥伴們自行前往。 什麼是對象池? 對象池,也稱為資源池,是一種用於存儲和重複使用對象的機

jianrendechaomian_czry72 頭像

@jianrendechaomian_czry72

昵稱 億元程序員

@nanchengfe

[譯]原生CSS嵌套使用

本文翻譯自 CSS Nesting,作者:Ahmad Shadeed, 略有刪改。 如果你是一個前端開發人員,那麼你應該使用過CSS預處理器以及預處理器中的嵌套特性。它一直是一個受歡迎的功能,我一直都在使用CSS預處理器。 今年所有的主流瀏覽器都支持原生CSS嵌套:Chrome、Firefox和Safari。這是一個重要的CSS功能,這將使編寫CSS更加容易。在本文中我將記錄到目前為止我所學到的關

nanchengfe 頭像

@nanchengfe

昵稱 南城FE

@huobaodejianpan

【教程】如何使用Postman測試接口?詳細指南

在當前,API(應用程序接口)的使用變得越來越普遍。其中,HTTP/HTTPS API 是最常見的一種。無論是開發前端還是後端,測試 API 都是一個關鍵環節。Postman 是一種流行且強大的 API 測試工具,能夠幫助開發人員輕鬆地進行接口測試和調試。 一、什麼是 Postman? Postman 是一個專用於 API 開發的跨平台工具。它提供了簡潔易用的界面,幫助開發者和測試人員發送 HTT

huobaodejianpan 頭像

@huobaodejianpan

昵稱 火爆的鍵盤

@huobaodejianpan

掌握 HTTP 請求方法:開發者必備知識

在 Web 開發領域,HTTP 方法在定義客户端如何與 Web 服務器交互以及對資源執行不同操作方面起着至關重要的作用。HTTP(Hypertext Transfer Protocol,超文本傳輸協議)是現代網絡應用的棟樑,它定義了客户端與服務器之間的通信方式。 什麼是 HTTP 請求方法 在 Web 通信中,HTTP 請求方法是客户端用來向服務器表達其意圖的一種方式。每次瀏覽網頁、提交表單或與

huobaodejianpan 頭像

@huobaodejianpan

昵稱 火爆的鍵盤

@ruanjiankaifa_xiaofanya

JVS邏輯引擎如何保障API接口免受非法訪問?邏輯調用安全設置策略詳解

隨着互聯網信息技術的發展,API(應用程序編程接口)成為不同系統間數據交互與功能調用的重要橋樑。邏輯的API調用,已成為配置的邏輯功能為其他程序提供服務的主要形式之一,在實際應用中,如何確保API接口不被未經授權的外部系統訪問,防止數據泄露和非法操作,那麼邏輯的策略是每一個開發者都需要重點思考的問題。接下來我詳細説一説在JVS邏輯引擎裏,邏輯API調用的安全設置策略,包括邏輯訪問憑證的選擇與配置、

ruanjiankaifa_xiaofanya 頭像

@ruanjiankaifa_xiaofanya

昵稱 軟件部長

@invalidnull

rxjs 裏 Skip 操作符的一個使用場景

skip 操作符允許我們忽略源的前 x 個排放。 當我們有一個始終在 subscription 上發出希望忽略的某些值的可觀察對象時,就可以使用這個操作符。比如 Observable emit 的前幾個值並不是我們感興趣的值,另一種情況是我們訂閲了 Replay 或 BehaviorSubject,並且不需要對初始值進行操作,而只關心初始值之後的數據 emit. 這種情況下,skip 操作符非常有

invalidnull 頭像

@invalidnull

昵稱 註銷

@aran_tu

5 張彈珠圖徹底弄清 RxJS 的拉平策略:mergeMap、switchMap、concatMap、exhaustMap

RxJS 的操作符理解起來確實比較複雜,比如最常用的幾種 map 操作符,本篇就來使勁衝一衝它們!! 原創文章,非商業轉載請説名出處 map 操作想必大家一定不陌生: const { of } = Rx; const { map } = RxOperators; const namesObservable = of('A', 'B'); namesObservable.pipe(

aran_tu 頭像

@aran_tu

昵稱 掘金安東尼

@invalidnull

使用 RxJS timeout 操作符給 Angular SSR 服務器端渲染模式下的 HTTP 請求添加超時機制

Angular Universal 是一個開源項目,擴展了 @angular/platform-server 的功能。 該項目使 Angular 中的服務器端渲染成為可能。 為了在服務器上渲染,Angular 使用 node.js 的 DOM 實現——domino. 對於每個 GET 請求,domino 都會創建一個類似的 Browser Document 對象。 在該對象上下文中,Angular

invalidnull 頭像

@invalidnull

昵稱 註銷