tag 前端

標籤
貢獻1,041
1055
06:37 AM · Oct 27 ,2025

@前端 / 博客 RSS 訂閱

你好2007 - 理解prototype和__proto__(繼承與原型鏈)

從關係圖中可以看出來,ECMAScript中創建一個對象是通過new構造函數實現的,而本質上來説這個對象其實是以構造函數的屬性prototype指向的對象為基本模板的,因此新對象的__proto__屬性表明了自己來源於誰。 prototype 該屬性用來指向創建一個對象的基本模板,默認指向new構造函數,也可以修改,或者通過改屬性為新對象添加屬性。 需要注意的是,該屬性只有函數才有。 //構造函

prototype , 前端 , Javascript

收藏 評論

張子溪 - 解決 Angular 項目中,報錯: ‘router-outlet’ is not a known element 的問題。

在 app.component.html頁面中添加 router-outlet/router-outlet 標籤後報錯: 解決: 在路由文件,即 app-routing.module.ts 中,添加上一句:exports: [RouterModule] 截圖如下: 即可解決 router-outlet 的報錯問題。 參考: https://stackoverflow.com/questions

angular2 , 前端

收藏 評論

阿里巴巴文娛技術 - 優酷質量保障系列(二)—客户端自動化測試基礎能力建設

文娛妹導讀 自動化測試能力建設過程中,自動化框架選型、框架設計核心和思路、自動化能力平台接入,是自動化測試能力建設過程中重要環節。文章分享優酷APP自動化測試能力建設過程中的經驗 本系列文章將陸續發佈,感興趣的朋友持續關注! 前言 隨着移動端版本迭代的加快,快速測試,快速反饋已經是一個常態化的流程,週期內版本發佈頻率的增加,各項測試的時間正在急劇縮短,且迴歸性的任務不斷充斥當中,

工具 , 測試 , 移動端web , 自動化測試 , 前端

收藏 評論

那年 - vue 使用computed報錯 .. was assigned to but it has no setter.

問題: a-radio @change="chooseOther" v-model="tempReadio"其他/a-radio computed: { tempReadio() { if (this.reasonValue == 7) { return true; } else { return false; }

vue.js , 雙向綁定 , computed , 前端 , Javascript

收藏 評論

ishy - vue使用wangeditor4.0版本,並實現編輯器內容雙向綁定

下載安裝 npm i wangeditor --save 封裝組件Editor 新建Vue組件Editor 初始化編輯器組件 template lang="html" div id="editor" /div /template script import E from 'wangeditor' export default { name:

vue.js , 編輯器 , 雙向綁定 , wangeditor , 前端

收藏 評論

EthanProcess - 我是如何在 Vue 項目中做代碼分割的

通常為了開發效率,我們會使用 vue-cli 創建項目,這樣創建的項目默認情況下編譯是會對代碼進行分割的。但是如果是自行配置的 webpack 環境的話,還是很有必要熟悉代碼分割的相關知識的。 為什麼要做代碼分割 在配置 webpack 的過程中,很多時候我們的 webpack 入口只寫了一個 entry: '${sourceDir}/index.js’,默認情況下只會生成一個 bundle 文件

vue.js , 前端優化 , webpack , 前端

收藏 評論

xizugogo - Vue響應式原理概述

1 MVVM模式 Model-View-ViewModel源自MVC模式,核心是ViewModel,ViewModel作為一個“中轉站”,對接Model層獲得並轉換數據使得數據易管理、便於View層使用,又對接View層進行雙向的數據綁定。MVVM框架利用ViewModel這一層幫助開發者們做好了之前jQuery時代低效的查找、操作DOM的工作。View最終展現的不僅是Model的數據,也是經過V

vue.js , mvvm , 原理 , 前端

收藏 評論

pingan8787 - 5個Chrome調試混合應用的技巧

對前端開發人員來説,Chrome 真是一個必備的開發工具,大到頁面展示,小到 BUG 調試/HTTP 抓包等,本文我將和大家分享自己做混合應用開發過程中經常用到的幾個調試技巧。 一、調試安卓應用 在進行混合應用開發過程中,經常需要在安卓應用中調試 H5 項目的代碼,這裏我們就需要了解安卓應用如何在 Chrome 上進行調試。 接下來簡單介紹一下,希望大家還是能實際進行調試看看: 1. 準備工

瀏覽器 , hybrid-app , 調試技巧 , 前端 , Javascript

收藏 評論

羊先生 - Vue適配PC+大屏,手機+ipad適配

PC+大屏適配 可適配 1400px以上的屏幕 查看演示 項目地址 設置設計稿-轉換rem 我們的設計稿是3840px寬度,所以widthOfDesignLayout設置3840 module.exports = { plugins: { autoprefixer: {}, "@njleonzhang/postcss-px-to-rem": {

vue.js , 移動端web , 前端 , html5

收藏 評論

trueYann - 使用vuex4.0完成兩個組件數據的雙向綁定(實現modules模塊化)

問題場景:在優化項目的交互體驗時,想實現在左側表單輸入數據,右側篩選條件組件同步顯示輸入的功能,第一時間想到使用vuex 由於vuex升級到了4.0,語法發生了較大的變化,首先查詢官方文檔 vuex官方文檔 看到項目結構引起了我的注意,考慮到後期管理項目能更加便利,使用modules勢在必行 在store目錄下新建modules文件夾,之後的module文件都放在這個文件夾

vue.js , vuex , 模塊化開發 , 前端

收藏 評論

編程三昧 - WebSocket 對象簡介

WebSockets 是一種先進的技術。它可以在用户的瀏覽器和服務器之間打開交互式通信會話。使用此API,您可以向服務器發送消息並接收事件驅動的響應,而無需通過輪詢服務器的方式以獲得響應。 何為 WebSocket 對象? WebSocket 對象是 WebSockets 的接口之一,用於連接WebSocket服務器的主要接口,之後可以在這個連接上發送 和接受數據。 WebSocket 對

websocket , 技能表 , 前端優化 , 前端

收藏 評論

霧島聽風 - 如何在angular中使用vue

將Vue組件包裝為本Web組件。 由於Angular支持使用自定義Web組件,因此能夠使用Vue組件(包裝為Web組件)。 對於Angular,如果自定義Web組件是由Vue生成的,那麼它就沒有區別(對於所有Angular都知道,它們可以是本機HTML元素) 我們使用vue-custom-element來來進行包裝 demo地址:這裏使用element-ui作為組件導入angular使用

vue.js , angular4 , 前端

收藏 評論

編程三昧 - Webpack 簡介

構建其實是工程化、自動化思想在前端開發中的體現,把一系列流程用代碼去實現,讓代碼自動化地執行這一系列複雜的流程。 構建給前端開發注入了更大的活力,解放了我們的生產力。 Webpack 憑藉強大的功能與良好的使用體驗,已經成為目前最流行,社區最活躍的構建工具,是現代 Web 開發必須掌握的技能之一。 背景 在當下的前端環境裏,各種框架和工具層出不窮,比如 React、Vue、Angular 等,極大

構建工具 , 前端構建 , 工程化 , webpack , 前端

收藏 評論

kkocdko - 3 KB 的博客首頁,我是如何做到的?

這並不是一篇網絡上氾濫的“前端體積優化”文章。 百尺竿頭,更進一步!本文以我的博客為例,介紹極限控制頁面體積的奇技淫巧。 成果預覽 眼見為實,本人博客首頁 的網絡傳輸總體積為 2.6 KB。 本人的博客 Repo 在 kblog - GitHub,喜歡就給個 Star 唄~ 需求精簡 平淡無奇的頁面,體積再小,也不足為奇。我需要: 單頁面(SPA)。 使用 Material

material-design , Css , spa , 前端 , Javascript

收藏 評論

MangoGoing - koa實踐總結

什麼是koa? koa是Express的下一代基於Node.js的web框架。使用 koa 編寫 web 應用,通過組合不同的 generator,可以免除重複繁瑣的回調函數嵌套,並極大地提升常用錯誤處理效率。Koa 不在內核方法中綁定任何中間件,它僅僅提供了一個輕量優雅的函數庫,使得編寫 Web 應用和API變得得心應手。 Koa能幹什麼? 主要用途 網站(比如cnode這樣的論壇) ap

koa2 , node.js , koa.js , 前端 , Javascript

收藏 評論

拖泥羊 - 前端工程化4:如何去做js模塊化開發?ES Modules/CommonJS有什麼區別?

1. 如何去做js模塊化開發 = 模塊化標準 + 加載器 1.1、我們説討論的僅限於javascript代碼的模塊化,如果要涉及到所有文件的模塊化請使用webpack。 1.2、那麼js的模塊化可以用一句話概括:模塊化標準 + 加載器;本文主要介紹模塊化標準。 2. 幾種模塊化標準對比: CommonJS 1、以同步的模式加載模塊:通常在Nodejs環境使用,不適合瀏覽器 1. 因為服務器讀

模塊化 , commonjs , es-modules , 前端 , Javascript

收藏 評論

魔芋藥丸 - 【招商銀行-掌上生活-運行H5頁面】JS-SDK及其特有schema

掌上生活是一個比較先進的銀行App,不能單純當做瀏覽器來處理,其有專門提供的JS-SDK供調用 JS-SDK: https://open.cmbchina.com/Pla... 如果不想引入這個庫的話,有一些細微但重要的功能可以直接仿寫,比如判斷是否在掌上生活中,就是通過正則匹配UA判斷的 判斷是否在掌上生活中:/cmblife/.test(ua); 在該App內想要喚起美團,也不能直接使用

hybrid-app , 前端

收藏 評論

前端知識搬運工 - viewport深入理解和使用

什麼是viewport ? viewport是用户網頁的可視區域,也可叫做視區。手機瀏覽器是把頁面放在一個虛擬的窗口(viewport)中,通常這個虛擬的窗口比屏幕寬,這樣就不用把網頁擠到很小的窗口中,用户可以通過平移和縮放來看網頁的不同部分。 下圖為常見一些設備瀏覽器默認viewport寬度: css中的1px不等於設備的1px 在css中經常使用px做單位,PC端瀏覽器中的1px往往都

移動端web , 移動端適配 , 前端

收藏 評論

前端知識搬運工 - flex佈局製作自適應網頁

網頁佈局是css的一個重點應用。傳統的佈局都是依賴display、position、float屬性來實現的,但是特殊佈局就不易實現,如垂直居中。 01 flex佈局是什麼?‍ Flex 是 Flexible Box的簡寫,意為“彈性佈局”為盒模型提供最大靈活性。任何一個容器都可以指定為flex佈局。 採用flex佈局的元素,稱為flex容器。他的所有子元素自動成為容器成員,稱為flex項目,簡稱項

flexbox , Css , 前端

收藏 評論

前端學長Joshua - POST請求 之 對數據進行編碼處理

POST請求 之 對數據進行編碼處理 !-- TOC -- URLSearchParams URLSearchParams 的讀取和轉換操作 url.searchParams 讓 URLSearchParams 作為Fetch的請求體(body) FormData 讓 FormData 作為Fetch的請求體(body) 轉換為

網絡請求 , post , content-type , 編碼 , 前端

收藏 評論

葡萄城技術團隊 - 從頁面加載到數據請求,前端頁面性能優化實踐分享

背景 做過前端開發都知道前端的工作內容是很多的,對於HTML、CSS、Javascript、Image、Flash等各種內容的使用。為了更好提升應用的性能,我們需要對各種資源內容進行不同方面的優化。 對用户而言,優化可以讓應用的響應速度加快,加載更加迅速,可以帶來更好的使用體驗。 對於服務商而言,前端優化能夠減少頁面請求數量,寬帶所佔帶寬,有效的節省資源。 前端優化的內容很多,按照粒度等級劃

websocket , spreadjs , 前端優化 , 前端

收藏 評論

陌路凡歌 - Nginx配置單頁應用

上一期我們講了如何在一個新服務器上用Nginx跑起一個前端項目,但是還有很多缺陷,比如我們想在這個Nginx下跑多個項目怎麼辦,spa單頁項目常見的刷新空白原因及處理等等,本篇將一一介紹。 同端口多項目配置 假設我們有兩個單頁項目,一個pc官網,一個mobile官網,我們都想跑在上期8082端口上,這時候發現我們上一期部署的文件夾是直接放在www目錄下的,這可不行,文件全放這下面都不能區分是哪個項

單頁面應用 , Nginx , spa , 前端

收藏 評論

註銷 - 將您的基於 Accelerator 的 SAP 電商雲 Storefront 遷移到 Spartacus Storefront

原文:Migrate Your Accelerator-based Storefront to Project Spartacus 如果您已閲讀過“遷移到 Spartacus javascript storefront 項目的五個原因”和“SAP Commerce Cloud Project Spartacus 入門”這兩篇文章,您可能想要遷移到基於無狀態高性能架構的 storefront, 並且

vue.js , sap , spa , 前端 , Javascript

收藏 評論

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

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

react , vue.js , localstorage , 前端 , Javascript

收藏 評論