@前端

动态 列表
@invalidnull

Rxjs mergeMap 的使用場合

注意: flatMap 是 mergeMap 的別名。 如果一次只能激活一個內部訂閲,請使用 switchMap. 如果內部 observables 的發射和訂閲順序很重要,請使用 concatMap. 當需要展平內部 observable 但想要手動控制內部訂閲的數量時,是 mergeMap 極佳的使用場合。 例如,當使用 switchMap 時,每個內部訂閲在源發出時完成,即任意時間

invalidnull 头像

@invalidnull

昵称 註銷

@invalidnull

Rxjs map, mergeMap 和 switchMap 的區別和聯繫

map、mergeMap 和 switchMap 是 RxJS 中的三個主要運算符,在 SAP Spartacus 開發中有着廣泛的使用場景。 map map 是 Observables 中最常見的運算符。 它的作用與數組中的映射相對相似。 map 接收從 Observable 發出的每個值,對其執行操作並返回一個 Observable(因此 Observable 鏈可以繼續)。 把它想象成一個函

invalidnull 头像

@invalidnull

昵称 註銷

@invalidnull

rxjs Observable 設計原理背後的 Pull 和 Push 思路

Observables 顧名思義,是可以被觀察的事務。在 Rxjs 的上下文裏,Observable 會隨着時間的推移,在某個時間點產生數據。 Observables 可以: 不停地(永遠)產生值,比如 interval 操作符。 可以一次性生產價值,然後進入 complete 狀態。 可能會產生錯誤,然後進入 complete 狀態。 Observable 是一種異步事件的實現利器,例

invalidnull 头像

@invalidnull

昵称 註銷

@invalidnull

rxjs Observable 兩大類操作符簡介

Observable 生產的數據,應該提供開發人員足夠的自由度,對這些數據進行各種處理,比如 map / transform 等等。這就是 Rxjs Operator 大展身手的地方。 運算符是對 Observable 進行操作並返回 Observable 的函數。 這允許我們鏈接這些運算符。 鏈中的每個運算符都會修改由前一個運算符的運算產生的 Observable。 鏈中的算子不會同時工作,而是

invalidnull 头像

@invalidnull

昵称 註銷

@crister_612f55567eb8c

本週遇到的問題

首先是又遇到了一些RXjs操作符,在這裏簡單的説一下。 首先是 combineLatest。 將其直接翻譯過來就是結合最新的(observeble),那麼結合一下下面這張圖片就很容易理解了。 combineLatest結合作為參數傳遞的所有 Observables 的值。這是通過按順序訂閲每個 Observable 並在任何 Observable 發出時從每個 Obser

@42_6398721f10a5e

前端 - 封裝一個通用的接口請求工具

在前端開發中,接口請求是一個非常基本的需求。幾乎每個項目都會針對自己的使用場景對接口請求操作進行一系列封裝。今天我們也來一步步封裝一個通用的請求工具。 使用效果 首先讓我們來看看封裝完後的使用效果吧。 首先我們將提供一個 defineApi 函數,用於定義接口的配置信息,包括 url,請求參數以及返回類型等,具體使用方法如下: const BASE_URL = 'https://example.c

@zz_641473ad470bc

關於不同窗口,訂閲不生效的問題

問題 兩個窗口,顯示組件,A窗口顯示A組件,B窗口顯示B組件,兩個組件共同訂閲一個Service中的Subject,當在A組件中進行修改後,Service中的Subject發送通知,“值變更了”,B組件訂閲不到。 現在打開兩個窗口,每個窗口顯示一個組件,每個組件都訂閲 Service 中的 subjectTest, 在AComponent組件中,每隔一秒發送一條數據: AComponent 組件

zz_641473ad470bc 头像

@zz_641473ad470bc

昵称 zZ_jie

@nine_59f82397ef519

Webpack小技巧-公共組件引用路徑簡化

日常開發中,我們會常常把一些功能提取出來,包裝成一個公共模塊或者組件,供不同地方使用,但是隨着項目不斷變大,項目目錄不斷變深,我們引用公共組件的路徑越來越長! 例如:引用一個公共模塊 import Menu from '../../../../../components/Menu'; // 這裏路徑太深,很容易寫錯 我們該怎麼優化尼? 解決方案1:使用webpack的resolve.alias屬性

@echeverra

玩轉Angular系列:組件間各種通信方式詳解

前言 在前端框架Angular中,組件之間的通信很基礎也很重要,不同組件間的通信方式也不同,掌握組件間的通信方式會更加深刻的理解和使用Angular框架。 本文講解不同類型組件間的不同通信方式,文中所有示例均提供源碼,您可以 在線編輯預覽 或 下載本地調試,相信通過本文您一定可以掌握組件通信這一知識點。 父組件傳子組件 @Input方式 @Input()裝飾器允許父組件更新子組件中的數據,分為

echeverra 头像

@echeverra

昵称 echeverra

@huaweiyun

教你學會使用Angular 應用裏的 export declare const X Y

摘要:export declare const X: Y語法用於在Angular應用程序中聲明一個具有指定類型的常量變量,並將其導出,以便在其他文件中使用。 本文分享自華為雲社區《關於 Angular 應用裏的 export declare const X Y 的用法》,作者:Jerry Wang。 最近做 Spartacus 的 Angular 開發時,遇到下面這種 TypeScript

huaweiyun 头像

@huaweiyun

昵称 huaweiyun

@shuyuanutil

rust angular 自簽名證書 wss

項目中採用 wss 來建立的前後端連接, 但是並沒有用到認證的證書, 所以自己用 openssl 生成了私鑰, 自簽名證書來使用: 這裏就不再贅述 Wss 連接過程, 直接上手操作: 1. 生成私鑰, 證書: 請查看:使用 openssl 安裝和生成證書 - 書源 - 博客園 (cnblogs.com) 2. rust 服務端: 將生成的server.crt 和 server.key 放到d:\\

shuyuanutil 头像

@shuyuanutil

昵称 書源

@inslog

筆記 | Angular 實現 keep-alive (路由複用)

Angular 的路由複用策略(RouteReuseStrategy)是一種用於優化路由跳轉性能和提高用户體驗的機制。通過實現RouteReuseStrategy接口,後可以自定義路由的複用行為,避免不必要的組件銷燬和重建,同時保持組件的狀態。 以下是對Angular路由複用策略的詳細介紹: 一、基本概念 RouteReuseStrategy是 Angular 路由模塊提供的一個接口,用於控制路由

inslog 头像

@inslog

昵称 iNSlog

@huajianketang

Angular CLI 源碼分析

🔥 重磅推薦!這份文檔 + 課程《Angular CLI 源碼分析》 = 王炸組合 💥 雙倍知識,雙倍快樂,帶你起飛~ 🚀 (ง •_•)ง 準備: 安裝 Node.js https://nodejs.org/; 安裝 VS Code https://code.visualstudio.com/; 創建文件夾 angular-cli-source-learn; 安裝 Angu

huajianketang 头像

@huajianketang

昵称 華健課堂

@refanbanzhang

SPA應用的hash模式和history模式部署問題

hash模式和history模式的差異是什麼? 拿這個地址為例: http://xxx.com#about http://xxx.com/about hash模式 由於http請求並不包含hash,所以不管hash值為多少,服務器端收到的請求始終都是/。 history模式 history模式下,後面的/about路徑會被服務器接收到,然後嘗試去處理這個/about。 為什

refanbanzhang 头像

@refanbanzhang

昵称 熱飯班長

@immerse

Next.js 中為什麼 App Router 可能是未來,但 Pages Router 仍然重要?

Next.js 作為一個強大的 React 框架,為開發者提供了兩種路由系統:App Router 和 Pages Router。這兩種路由系統各有特色,適用於不同的場景。本文將深入探討這兩種路由系統的區別、優缺點和使用場景,幫助你做出最佳選擇。 App Router:新一代的路由革命 App Router 是 Next.js 13 引入的新路由系統,它使用 app 目錄來組織路由,帶來了許多令人

immerse 头像

@immerse

昵称 沉浸式趣談

@htvlz

HTML 樣式

您已經很好地概述了HTML中style屬性的用途以及它與舊HTML標籤和屬性的對比。style屬性確實提供了一種靈活且強大的方式來直接在HTML元素上應用CSS樣式,而無需依賴外部或內部樣式表(儘管在大型項目中,通常推薦使用外部樣式表以維護樣式的集中管理和重用性)。 使用style屬性的好處 直接性:可以立即看到樣式變化的效果,無需跳轉到CSS文件進行修改。 靈活性:對於小型項目或快速原型設

htvlz 头像

@htvlz

昵称 海豚V靚仔

@htvlz

HTML 文本格式化

HTML 提供了豐富的元素來格式化文本和展示內容,這些元素不僅讓網頁內容更加豐富多彩,還提高了內容的可讀性和表達力。下面是對您提到的一些文本格式化標籤和“計算機輸出”標籤的進一步解釋和説明: 文本格式化標籤 b 和 strong:兩者都用於加粗文本,但 strong 在語義上更強調文本的重要性,而 b 僅僅是樣式上的加粗。 i 和 em:i 用於表示斜體文本,但主要是樣式上的變化;em 則用

htvlz 头像

@htvlz

昵称 海豚V靚仔

@qfifteen

中後台開發必修課:Vue 項目中 Pinia 與 Router 完全攻略

前言 本篇文章主要講解如何來配置 Pinia 和 Vue Router 本文也是《通俗易懂的中後台系統建設指南》系列的第二篇文章,該系列旨在告訴你如何來構建一個優秀的中後台管理系統 寫在前面 路由(Router)和狀態管理(Vuex、Pinia)是 Vue 項目中的常客。基本上在 Vue 的項目中,我們構建一個 Web 應用都離不開它們,如果你是 Vue2 的用户,那麼你對它們不會陌生 如果你是跟

qfifteen 头像

@qfifteen

昵称 十五

@htvlz

小米13T Pro系統合集:性能與攝影的極致融合,值得你升級的系統ROM

小米 13T Pro 是一款性能卓越、設計精美的旗艦機型,具備多項領先配置,且在與前一代產品及友商機型的對比中優勢明顯,值得深入探討。 性能提升 小米 13T Pro 搭載了最新的 天璣 9200+ 處理器,相較於前一代(小米 12T Pro)的 驍龍 8+ Gen 1,在性能和能效表現上均有顯著提升。天璣 9200+ 的 AI 算力及多任務處理能力使得系統響應速度更快,用户在運行大型應用、遊戲或

htvlz 头像

@htvlz

昵称 海豚V靚仔

@htvlz

HTML 註釋

關於HTML註釋標籤和條件註釋的説明非常清晰。 HTML 註釋標籤 HTML中的註釋標籤用於在代碼中添加説明或註釋,這些註釋對瀏覽器是不可見的,因此不會影響頁面的顯示。註釋標籤的語法非常簡單,以!--開始,以--結束。註釋可以用於解釋代碼段的功能、標記需要修改或待完成的部分,或者放置版權信息、作者信息等。 示例 !-- 這是一個註釋,它不會在頁面上顯示 -- p這是一個段落。/p !-- 提醒:

htvlz 头像

@htvlz

昵称 海豚V靚仔

@htvlz

HTML 顏色

顏色在網頁設計和數字藝術中扮演着至關重要的角色。正如您所提到的,顏色可以通過紅色、綠色和藍色的混合(RGB)來定義,這種混合方式允許我們創建出數百萬種不同的顏色。每種顏色的強度(或稱為亮度)可以從0(最暗,表示為#00)到255(最亮,表示為#FF)變化。 在HTML和CSS中,顏色可以通過十六進制顏色代碼(如#FF0000表示紅色)、RGB函數(如rgb(255, 0, 0)也表示紅色)或者顏色

htvlz 头像

@htvlz

昵称 海豚V靚仔