tag vue.js

標籤
貢獻382
547
05:55 PM · Oct 25 ,2025
tuzixiansen_63d4d65909d62 頭像 opentiny 頭像 u_17148819 頭像 u_9849794 頭像 8848_62c77d4bb2532 頭像 u_15967048 頭像 tanking 頭像 refanbanzhang 頭像 kangkaidafangdezi 頭像 kestrel_task 頭像 u_16307147 頭像 u_13738137 頭像

@vue.js / 博客 RSS 訂閱

tiantiantiantianxuexi 頭像

天天天天學習丶 - 第一次vue單頁面應用ios低版本爬坑總結

1.vue打包後iphone 5c ios10.3.3打開報錯,調試時無錯誤. 求解決辦法 問題鏈接 解決辦法 webpack.prod.conf.js 配置 const UglifyJsPlugin = require('uglifyjs-webpack-plugin') new UglifyJsPlugin({ uglifyOptions: { compress: {

vue.js , webpack-dev-server , 單頁面應用 , babel , Javascript

收藏 評論

yaorao 頭像

大白兔粘牙 - Virtual Dom - Diff 之 patchVnode 方法

該方法用來真正對新舊節點進行對比，得到最小應該變化的DOM，然後直接更新DOM。下面是需要patch的幾種情況，這幾種情況都會有對應的真實DOM測試用例來驗證。 function patchVnode(oldVnode, vnode) { const elm = vnode.elm = oldVnode.elm; const { children: oldCh } = oldVn

vue.js , virtual-dom , diff

收藏 評論

hai2007 頭像

你好2007 - v-solt 插槽（基礎使用、具名插槽、作用域插槽等）

基本使用 組件通過slot預留位置，使用組件的時候，可以通過傳遞具體的內容去替換slot佔用的地方，這就是插槽。 比如現在定義了一個組件： !-- simple-use.vue -- template div slot/slot /div /template 組件slot/slot佔用的位置具體內容不確定，需要使用的時候傳遞進來，我們就可以這樣使用： simple-use em

vue.js , htm , template.js , 前端 , Javascript

收藏 評論

zyronon 頭像

zyronon - 不到200行用Vue實現類似Swiper.js的輪播組件

前言 大家在開發過程中，或多或少都會用到輪播圖之類的組件，PC和Mobile上使用 Swiper.js ，小程序上使用swiper組件等。 本文將詳細講解如何用Vue一步步實現的類似Swiper.js的功能，無任何第三方依賴，乾貨滿滿。 最終效果 在線預覽：https://zyronon.github.io/douyin/ 項目源代碼：https://github.com/zyronon/douy

vue.js , swiper.js , 手寫組件 , 前端

收藏 評論

kangkaidafangdezi 頭像

多客Duoke - 全開源婚戀相親/同城交友社交小程序系統搭建，為您的夢想賦能！

付費會員與增值服務、隱私保護機制、線上/線下活動報名、靈魂匹配（根據信息）、左滑右滑心動、漂流瓶、邀約、圈子帖子（可發佈付費內容）、紅娘牽線（專屬紅娘端口）、邀請獎勵等。 一、功能性架構：技術驅動婚戀服務升級 1、智能匹配引擎 2、基於機器學習算法，系統可綜合用户填寫的年齡、職業、興趣標籤等顯性信息，以及瀏覽行為、聊天記錄等隱性數據，生成動態匹配模型。系統可通過分析用户對"線下

vue.js , MySQL , 小程序 , php , Nginx

收藏 評論

tuzixiansen_63d4d65909d62 頭像

兔子先森 - vue3一個簡單好用的複製到剪貼板插件

npm: https://www.npmjs.com/package/vue-clipboard2 開始 npm i vue-clipboard2 在main.ts中引入 import Vue from 'vue' import VueClipboard from 'vue-clipboard2' Vue.use(VueClipboard) 引入後就可以直接在頁面中使用了 script setu

vue.js , HTML , 前端 , html5 , Javascript

收藏 評論

charon_5f4765a39cea7 頭像

charon_5f4765a39cea7 - vue 源碼解析(3-2-2,虛擬dom)

前面寫過一個snabbdom的解析，vue2.0版本用的就是這個，然後在他的基礎上添加了一些功能 推薦先去看下總結：vue源碼總結 vue-clic生成項目中的render 中的 h 函數,就是createElement() src/core/instance/render.js中創建h函數 Vue.init 的時候會調用initRender 初始化_render，

vue.js , virtual-dom

收藏 評論

u_9849794 頭像

子丶不語 - 如何避免JS，CSS對DOM渲染的阻塞

避免CSS對DOM的阻塞 1. 異步加載CSS： 通過將CSS文件的加載設置為異步，可以確保HTML解析不會被阻塞。這可以通過在`link`標籤中添加`rel="async"`屬性來實現。這樣，瀏覽器會在後台加載CSS文件，而不會停止HTML的解析。 linkrel="stylesheet"href="styles.css"d

vue.js , 加載 , 前端開發

收藏 評論

nanian_5cd6881d3cc98 頭像

那年 - vue+jest 項目中的單測，持續更新..

剛開始接觸jest， 原理api啥的網上一堆，僅自己寫項目記錄下，有問題可以留言一起學習 emit事件 頁面： handleClose() { this.$emit('update:isShow', false) }, jest： test('handleClose', () = { wrapper.vm.handleClose() expect(wrap

vue.js , 自動化測試 , jest , 前端 , Javascript

收藏 評論

qinglong_62898aa51988d 頭像

清隆 - 細説Vue2的響應式原理

什麼是響應式 在 Vue 開發中，我們修改了數據，所有用到這份數據的視圖都會更新。 響應式概括來説就是數據驅動視圖的自動更新 舉個例子，本文也將以下面這段代碼來講解與實現響應式 HTML div id="app" {{ obj.message }} /div JS let data = { obj: { message: 'Hello Vue!', }, } new Vue(

vue2 , vue.js , 響應式 , 前端 , Javascript

收藏 評論

winnn 頭像

Winn - 使用炫酷的vue動畫庫，輕鬆給網站上大分

關於vue的動畫庫有很多，但今天我只分享兩個，GSAP和Vue-Lottie是個人認為目前功能比較強大的動畫庫。 1、GSAP 地址：https://greensock.com GSAP全稱為GreenSockAnimationPlatform，是一個從flash時代一直髮展到今天的專業動畫庫。來看一下如何在vue項目中使用： 和其他動畫庫一樣，你可以使用npm或cdn等方式去安裝，安裝和使

vue.js , 動畫 , 網站開發 , 前端 , html5

收藏 評論

tuzixiansen_63d4d65909d62 頭像

兔子先森 - 項目啓動報錯node:events:485 的解決方法以及報錯問題排查思路

錯誤分析 1、報錯結果 Error: spawn E:\xxx\xxx\node_modules\.pnpm\esbuild@0.11.3\node_modules\esbuild\esbuild.exe ENOENT 路徑中明確顯示了 esbuild@0.11.3，這告訴我們系統試圖訪問的是這個特定版本。 2、spawnargs 參數中的版本信息 spawnargs: [ '--service

react , vue.js , vite , 前端 , html5

收藏 評論

tanking 頭像

TANKING - 直接在html中引入Vue.js的cdn來實現一個簡單的博客

摘要 其實建立一個博客系統是非常簡單的，有很多開源的程序，如果你不喜歡博客系統，也可以自己開發，也可以自己簡單做一個。我這次就是用Vue.js和php做後端服務實現一個簡單的博客。 界面 代碼結構 代碼 index.html !DOCTYPE html html lang="en" head titleVueBlog/title meta charset="UTF-8"

vue.js , blog , 博客搭建 , 博客 , Javascript

收藏 評論

u_16213665 頭像

mob64ca140beea5 - javascript省市縣數據源

場景 使用靜態地址數據時,需要將數據轉換為ui組件可以使用的格式. 但是每次都進入數據遍歷和格式化會導致性能損耗嚴重以及等待時長 所以需要將格式化的數據創建到本地json數據文件,直接取用即可 省市區列表數據格式 整體是一個 object，包含 province_list, city_list, county_list

vue.js , node.js , javascript省市縣數據源 , 前端開發 , html5 , Javascript

收藏 評論

wynectar 頭像

忘憂N - 【交互式天氣儀表盤】項目帶你快速瞭解 SVG 知識

本文目標 通過此項目來完成 SVG 的基礎學習 完成此項目，會對 SVG 有個清晰的認識並能繪製出一些簡易及稍微複雜的圖案 工具 SVG 在線編輯器 SVG 在線編譯器 文檔 SVG 參考手冊 MDN 學習參考 SVG 基礎 SVG，可縮放矢量圖形（Scalable Vector Graphics），是一種用於描述二維圖形的 XML 標記語言。 SVG 常見屬性 SVG 不

vue.js , 知識 , 前端 , svg

收藏 評論

u_16307147 頭像

米女巫 - jQuery核心函數：$.ajax

1、$.ajax方法 方法描述：執行一個異步的HTTP的請求。 需求描述：執行一個異步的HTTP GET請求，從服務器加載數據。 $.ajax({ url: '/user/login', type: 'get', data: { username: 'zhangsan', password: '1

vue.js , 加載數據 , HTTP , Ajax , 前端開發

收藏 評論

lixiangyu 頭像

李祥雨 - vue-cli4創建vantUI項目，按需引入，適配Rem，自定義主題

使用vue-cli4創建一個vue項目 //vue-cli@4.2.3 vue create vant-demo 根據自己的需要選擇對應的配置，此處略過。。。 PS:因為vantUI使用的是less預處理器，配置時建議選擇此處理器。 安裝vantUI,按需引入 安裝vantUI npm i vant -S 按需引入 babel-plugin-import是一款 babel 插件，它會在編譯過

vue.js , vant , rem , vue-cli , Javascript

收藏 評論

u_17028302 頭像

wx66ece9f42611c - ECharts 重複 Name 渲染問題：legend 與 series 同名顯示異常的完整解決方案

在 ECharts 數據可視化開發中，你是否遇到過這樣的場景：明明在 series 中配置了多個數據系列，且部分系列的 name 重複（比如兩個“1”類別的月度數據），但圖例（legend）只顯示一個重複項，而tooltip 提示卻能正常展示所有重複數據？這種“圖例缺失、tooltip 正常”的矛盾，本質是 ECharts 對 legend 的默認去重機制導致的。本文將從問題場景、根源分

vue.js , 數據 , 圖例 , 唯一標識 , 前端開發

收藏 評論

huahua_5c80b6a7923d6 頭像

huahua - vue 上傳圖片判斷大小尺寸

uploadImg(e, record, index) { const file = e.target.files[0]; // 判斷上傳圖片的大小 限制 if (file.size / 1024 1000) { const that = this; let imgWidth = ""; let imgHight = ""; // 限制圖片的尺寸 為2

vue.js , formdata

收藏 評論

tanking 頭像

TANKING - Vue3.3.4+Vite使用組合式API開發一個簡單的博客+打包上線

摘要 本次案例是使用Vue3.3.4的組合式API實現一個簡單的博客開發流程和組件使用示例代碼，比較簡單，主要是通俗易懂，瞭解組合式API的使用。 創建項目 Windows cmd創建一個Vue3.2項目（使用cnpm國內鏡像高速構建） 開發 組件 views/Index.vue 首頁組件 components/blogList.vue 博客列表 components/SingleB

vue.js , vite , vue3 , 博客 , Javascript

收藏 評論

opentiny 頭像

OpenTiny社區 - 2025年OpenTiny年度人氣貢獻者評選正式開始

前言 攜手共創，致敬不凡！ 2025年，OpenTiny持續在前端開源領域紮根，每一位開發者都是推動項目共同前行的寶貴力量。從bug修復，到技術探討；從參與開源活動，到輸出技術文章；從使用項目，到參與共建，每一步跨越，都凝聚了開發者的智慧與汗水。 致敬所有在OpenTiny社區裏默默付出、積極貢獻、引領創新的傑出個人，我們正式啓動“OpenTiny年度貢獻者評選”活動！快為你喜愛的人氣貢獻者

vue.js , 前端 , Javascript

收藏 評論

u_14587 頭像

bugouhen - Vue--內置組件 - 前端筆記的個人空間 -

動態組件 語法 有些場景會需要在兩個組件間來回切換，比如 Tab 界面, 可通過component動態組件實現 !-- Home為組件名 -- component is="Home"/component component :is="'Home'"/component !-- currentTab 改變時組件也改變 -- co

vue.js , 緩存 , Css , ci , 前端開發 , HTML , 前端 , Javascript

收藏 評論

jello_5c89ccf558dcc 頭像

Jello - vue項目中安裝和使用vux組件

vux是一款基於Vue構建的移動UI組件庫（https://doc.vux.li/zh-CN/） 1.使用npm安裝vux npm install vux --save 2.安裝vux-loader（vux2必須配合vux-loader使用） npm install vux-loader --save-dev 3.安裝less-loader（用以正確編譯less源碼，否

vue.js , vux , Javascript

收藏 評論