tag 前端

標籤
貢獻1,058
1450
06:37 AM · Oct 27 ,2025

@前端 / 博客 RSS 訂閱

橘子小睿 - 通過 Swagger 定義自動生成 Mock 數據

我最近的在做的項目是一個前後端分離的項目,前後端由不同的團隊分別開發,並且前端的進度經常領先後端。這就意味着,當前端在開發一個新功能時,API 可能還沒有準備好。不過,我們會先和後端先商議好 API Schema,然後使用 Mock 數據進行開發。 但問題也隨之而來,定義 Mock 數據並配置 mock server 真的太浪費時間了!我真的非常討厭這種沒有任何技術含量的「苦力活」。所以,只好想辦

mock , 前端工具 , swagger , 前端

收藏 評論

JYeontu - vue配置文件自動生成路由和菜單

寫在前面 每次重複寫路由的時候是不是會覺得很煩,特別是項目大的時候,路由會有特別多,看都看不過來,所以這裏我是有了一個router.json的配置文件來對路由做一些簡單的配置,然後讓路由和左側菜單欄可以同時自動生成。 router.json 主要配置項如下: { "name": "routerConfig", "menu": [{ "id": "1", //路由id

vue.js , route , 路由 , 前端

收藏 評論

OpenTiny社區 - Vue2/Vue3 遷移頭禿?Renderless 架構讓組件 “無縫穿梭”

本文由體驗技術團隊劉坤原創。 "一次編寫,到處運行" —— 這不是 Java 的專利,也是 Renderless 架構的座右銘! 開篇:什麼是 Renderless 架構? 🤔 傳統組件的困境 想象一下,你寫了一個超棒的 Vue 3 組件: !-- MyAwesomeComponent.vue -- template div button @click="handleClick

vue.js , 開源 , 前端 , Javascript

收藏 評論

風流倜儻的傷痕 - 使用 nuxi preview 命令預覽 Nuxt 應用

title: 使用 nuxi preview 命令預覽 Nuxt 應用 date: 2024/9/8 updated: 2024/9/8 author: cmdragon excerpt: 摘要:本文介紹瞭如何使用nuxi preview命令預覽Nuxt.js應用,包括安裝和準備環境、啓動預覽服務器的步驟,以及如何指定根目錄和使用自定義.env文件等高級用法。通過nux

react , vue.js , angular , webkit , 前端

收藏 評論

鹽焗代碼蝦 - 小程序開發實戰案例之二|如何實現小程序支付

上一章講完如何獲取用户信息授權 後,下一步就可以進行小程序支付了。 本期就來介紹下支付寶小程序支付如何實現。 PS:接入前的準備工作可以參考:接入準備;接入指南可參考:接入指南~ 獲取小程序支付權限 獲取權限分為三步:分別是 賬號開通 JSAPI 支付、賬號與小程序賬號綁定 以及 小程序綁定 JSAPI 產品 賬號開通 JSAPI 支付 需要用收款主體賬號去簽約,賬號要求必須是企業或者是個體工

支付 , 小程序 , 支付寶 , 前端

收藏 評論

倔強青銅三 - vscode插件開發中文文檔教程(3)——擴展結構

vscode插件開發中文文檔教程(3)——擴展結構 原文鏈接:Extension Anatomy 作者:Microsoft 譯者:倔強青銅三 前言 大家好,我是倔強青銅三。是一名熱情的軟件工程師,我熱衷於分享和傳播IT技術,致力於通過我的知識和技能推動技術交流與創新,歡迎關注我,微信公眾號:倔強青銅三。歡迎點贊、收藏、關注,一鍵三連!!! 擴展結構 在上一個主題中,您已經能夠運行一個基

vscode插件 , typescript , 前端 , Javascript

收藏 評論

註銷 - 如何給 SAP Spartacus Storefront 創建新的頁面

Creating New Pages and Components Spartacus 是一個單頁面的應用程序,但它仍然使用頁面的概念來區分應用程序內的不同視圖。 Spartacus 頁面來自 CMS,由插槽和組件構成。 頁面包含插槽,插槽包含組件。 為了組織公共插槽和組件,Spartacus 支持頁面模板。 頁面模板包含佈局以及可全局使用的組件,例如頁眉和頁腳部分。 Spartacus 從 CM

頁面佈局 , saprfc , 前端 , Javascript

收藏 評論

一顆小行星 - 命令行操作生產svg動圖

代碼片段生成帶高亮效果的漂亮圖片我們可以使用carbon 但是如果想製作命令行操作的動圖一般是錄屏來轉換成GIF圖,其實還有另一種方式,我們可以使用asciinema + svg-term 生成SVG圖片 示例圖片 優點 操作過程簡單 更小的文件體積 矢量 可以手動修改速度和文案 文字可以複製 跨平台 首先需要安裝asciinema和svg-term 安裝asciinema sv

svg動畫 , 前端

收藏 評論

寫代碼的海怪 - 前端測試常見的 3 個誤區

前言 哈嘍,大家好,我是海怪。 在做前端測試時,選用合適的測試策略遠比一通猛狂測試更重要,所謂 “方向 努力”。 如果選擇了錯誤的測試策略,很容易寫出維護性差和不穩定的測試用例。一旦業務出現變化,用例就全崩了。可能這也是大家討厭寫測試的原因之一吧。 Kent C. Dodds 在這篇文章 [《Common Testing Mistakes 》](https://kentcdodds.com

測試 , 單元測試 , jest , 前端

收藏 評論

東奔西走的小喇叭 - 在快節奏體育時代,為什麼實時數據決定產品上限?

在當今數字化體育行業,實時、精準、穩定的賽事數據,已經成為體育應用能否成功的核心基礎。 無論是賽事直播平台、體育數據分析工具,還是體育資訊媒體,如果沒有毫秒級更新的數據支持,用户體驗很難真正做到“沉浸式”。 在這一背景下,越來越多開發者選擇使用專業體育數據服務商提供的 API,來構建自己的數據能力底座。 下面,從技術和產品角度,系統梳理一套成熟體育數據服務應具備的核心能力。 一、毫秒級實時數

JAVA , 後端 , 前端

收藏 評論

牛仔碼農 - Ajax基礎原理及使用教程(來自動力節點)

首先,我們來回顧下ajax是什麼? Ajax = 異步 JavaScript 和XML。 Ajax是一種用於創建快速動態網頁的技術。 通過在後台與服務器進行少量數據交換,Ajax可以使網頁實現異步更新。這意味着可以在不重新加載整個網頁的情況下,對網頁的某部分進行更新。 傳統的網頁(不使用 Ajax)如果需要更新內容,必須重載整個網頁面 前面談到ajax是什麼,其主要也就是異步提交,大家是否知道同步

Ajax , JAVA , ajax跨域 , 後端 , 前端

收藏 評論

瓏墨 - JavaScript 引擎如何工作?💭

😘前言:要了解 JavaScript 引擎,你必須瞭解當我們編譯和執行代碼時它的內容。一旦你完全閲讀了這篇文章,你就可以寫出一段優秀的代碼。這篇文章是關於JavaScript引擎的,它將幫助你瞭解JavaScript引擎的性能及其最有價值的功能,嘎嘎嘎,看下面😍。 一、什麼是 JavaScript 引擎?🧐 JavaScript引擎是一個程序,有助於將JavaScript代碼轉換為較低級別的

瀏覽器原理 , challenge , 前端 , html5 , Javascript

收藏 評論

leexiaoran - 桃翁的2019個人總結

又一年過去了,2018 年寫年終總結的場景還歷歷在目,寫這篇文章之前還專門去看了下 2018 年的年度總結,主要是看自己在 2018 學的東西自己還能記得啥。 印象最深刻的應該是還是函數式編程相關的東西,因為確實在我深入的去接觸它過後,我的很多編程思維都被它所影響。雖然在項目中不會去用很多函數式的方式去寫,但是函數式的那些特點深深的指導着我如何去設計一個更容易維護的函數,其中一些思維可以見我去年的

2019總結 , 程序員 , 前端

收藏 評論

銀之夏雪 - 深入剖析為什麼順序調用對 React Hooks 很重要?

在享受 React Hooks 帶來的便捷性的同時,我們必須嚴格遵循順序調用的規則,這一規則的重要性遠超我們的想象。本文將深入探討順序調用對 React Hooks 的重要性,並結合常見的缺陷,通過具體的代碼案例進行詳細闡述,揭示其背後深層次的原理。 一、React Hooks 工作原理 理解 React Hooks 的工作原理是掌握順序調用重要性的關鍵。React 內部維護着一個 Hooks 鏈

react , react-hooks , 前端 , Javascript

收藏 評論

浪跡天涯小king - taro小程的ScrollView,完美解決動態高度問題

廢話不多説,直接上代碼 import { ScrollView } from "@tarojs/components"; import Taro, { useReady } from "@tarojs/taro"; const [scrollHeight, setScrollHeight] = useState('84vh'); useReady(() = { // 設置ScrollV

react , taro , 前端

收藏 評論

一顆冰淇淋 - 為React組件庫引入自動化測試:從零到完善的實踐之路

為什麼我們需要測試? 我們的 React+TypeScript 業務組件庫已經穩定運行了一段時間,主要承載各類UI展示組件,如卡片、通知等。項目初期,迫於緊張的開發週期,我們暫時擱置了自動化測試的引入。當時團隊成員對組件邏輯瞭如指掌,即便沒有測試也能遊刃有餘。 然而隨着時間推移,問題逐漸顯現。當新成員加入或老組件需要迭代時,我們常常陷入兩難:修改代碼可能破壞原有功能,但不修改又無法滿足新需求。特別

react , 自動化測試 , typescript , 前端 , Javascript

收藏 評論

編程三昧 - CSS 選擇器總結

CSS 是用於網頁設計可用的最強大的工具之一。使用它我們可以在幾分鐘內改變一個網站的界面,而不用改變頁面的標籤。 好一段時間不用 CSS ,有一些基礎知識的記憶有點模糊了,今天再做一次總結記錄,方便日後回顧複習。 選擇器分類 在 CSS 中,選擇器可分為以下幾類: 基本選擇器(通配選擇器、元素選擇器、類選擇器、ID 選擇器、羣組選擇器) 層次選擇器 屬性選擇器 偽類選擇器 偽元素

css3 , css選擇器 , 樣式 , 前端 , html5

收藏 評論

DiracKeeko - [React] [Vue] 從vue切換到react 組件的封裝和使用

在組件封裝上,兩個框架差的不遠。 在Vue中封裝組件,用插槽的方式子組件中寫好具名插槽的位置和樣式,在父組件中通過插槽名傳入html和js邏輯 部分。 在react中封裝組件,區別於Vue的地方在於,Vue中有插槽這個語法,而react中沒有。在react中的html和js邏輯部分的傳遞都需要藉由屬性組件的屬性(Props)來完成。 (在Vue中插槽傳值,在react中屬性傳值) 此外,Vue中組

react , vue.js , 組件通信 , 組件封裝 , 前端

收藏 評論

Shenfq - React 中 setState 是一個宏任務還是微任務?

最近有個朋友面試,面試官問了個奇葩的問題,也就是我寫在標題上的這個問題。 能問出這個問題,面試官應該對 React 不是很瞭解,也是可能是看到面試者簡歷裏面有寫過自己熟悉 React,面試官想通過這個問題來判斷面試者是不是真的熟悉 React 🤣。 面試官的問法是否正確? 面試官的問題是,setState 是一個宏任務還是微任務,那麼在他的認知裏,setState 肯定是一個異步操作。為了判斷

react , promise , settimeout , 前端 , Javascript

收藏 評論

PatWu16 - Webview中h5上傳圖片踩坑記錄

前段時間開發端內h5項目,用到了h5上傳圖片,現記錄下遇到的坑。 端內h5上傳圖片問題歸納: 1、Webview中使用原生h5 input file上傳圖片時android只能單選、ios只能多選;android上還存在的一個問題為:點擊上傳按鈕進入圖片選擇頁後,如果取消選擇,返回項目,則無法再次上傳,會波及到整個webview,其他h5頁面也無法上傳,只有關閉此webview重新進入才可以

upload , file , 前端 , Javascript

收藏 評論

Light - 如何生成一個react 項目

環境要求:有安裝node和npm,沒有安裝的話,可以參考以下鏈接 https://segmentfault.com/a/1190000038536950 接下來,生成一個react 項目: 全局安裝create-react-app npm install create-react-app -g 選擇項目目錄,運行以下命令, projectname 是項目的名字

create-react-app , 前端

收藏 評論

mob64ca140ee96c - 2022最新Web前端經典面試試題及答案-史上最全前端面試題(含答案)

1、同步異步 異步和單線程 JS是單線程語⾔,只能同時做⼀件事。 瀏覽器和node.js已⽀持JS啓動進程,如Web Worker。 JS和DOM渲染共用同⼀個線程,因為JS可修改DOM結構。 異步是因為單線程而來的。 那麼遇到等待(網絡請求,定時任務)不能卡住,所以需要異步,異步是基於回調callback函數形

調用棧 , Vue , webgis , Css , 前端開發 , gis , HTML , 前端

收藏 評論

moveStar - mpvue小程序集成友盟統計

mpvue小程序集成友盟統計 一、登錄友盟後台管理系統,新建應用 二、去接入SDK 安裝sdk npm install umtrack-wx --save 在main.js(app.js)文件內添加如下代碼 import uma from 'umtrack-wx' // **引入文件一定要放在此文件的最前面** uma.init({ appKey: '

vue.js , 友盟sdk , mpvue , npm , 前端

收藏 評論