@vue2 / 博客 RSS 訂閱

Feb 12 2025

qngyun1029 - 縮放組件panzoom例子源碼

依賴插件如下： https://www.npmjs.com/package/panzoom（9.4.3） https://www.npmjs.com/package/decimal.js/v/10.2.0（10.2.0） https://nightcatsama.github.io/vue-slider-component/#/api/slots（vue-slider-compo

vue2

收藏 評論

Feb 27 2025

飛翔的蛋撻 - 為什麼説 Vue 是漸進式框架（Vue2必會）

今天聊聊Vue中一個我們經常忽視的問題，為什麼説 Vue 是漸進式框架？到底何為漸進式呢？ 下面我們來進行簡單的拆解吧。 一、重點描述 Vue 的漸進式設計，讓前端開發者始終擁有“選擇的權利”，而非被框架的設計哲學所束縛。 我覺得這一句話，是對 Vue 漸進式設計理念的完美詮釋。 二、細節剖析 1、何為漸進式 漸進式指 Vue 不強制要求一次性採用全部功能

vue2

收藏 評論

Jan 11 2024

DiracKeeko - [highcharts] 07_在highcharts渲染完成後結束loading

vue2項目 highcharts實例，如何在highcharts渲染開始時加載loading，在渲染結束時結束loading? 好久沒寫highcharts，最近有個同事寫highcharts時遇到了一個問題。 該業務場景的數據處理非常複雜，且存在某些個特定id的情況下，數據量極大，導致頁面上的highcharts卡頓(具體表現是：點了切換之後，有一段時間沒反應，之後highcharts重新渲染

vue2 , loading , highcharts , 前端

收藏 評論

Dec 19 2024

豐木 - npm安裝vue.js的2.x和3.x版本的vuex/vue-router/vue-cli安裝命令

1. vue2和vue3安裝幾個組件的指令有@的區別 vue2安裝組件指令沒有@, 但是vue3有, 我不知道為啥。 2. Vue.js 2.x 安裝指令 npm install -g vue-cli # 安裝Vue CLI npm install vue # 安裝Vue npm install vuex # 安裝Vuex npm install vue-r

vue2 , vue.js , vue3 , npm

收藏 評論

Nov 23 2021

墨城 - Vue3 和 Vue2 的 多種組件通信方式梳理

Vue3 通信使用寫法 1. props 方法一，混合寫法 // Parent.vue 傳送 child :msg1="msg1" :msg2="msg2"/child script import child from "./child.vue" import { ref, reactive } from "vue" export default { data(){ re

vue2 , 組件通信 , vue3

收藏 評論

Mar 15 2025

銀之夏雪 - Vue 3 vs Vue 2：深入解析從性能優化到源碼層面的進化

Vue.js 是當今前端開發中最受歡迎的框架之一。隨着 Vue 3 的發佈，它在性能優化、開發體驗、響應式系統、構建工具和熱更新等多個方面都帶來了巨大提升。本文將深入剖析 Vue 3 的進化，包括其 源碼實現 方面的優化，如 diff算法、靜態標記、編譯優化 ，以及 Vue 3 在熱更新、構建工具上的改進。 1. 性能提升：底層優化的革命 1.1 響應式系統的改進：從 Object.defineP

vue2 , vue.js , vue3 , 前端 , Javascript

收藏 評論

Jul 07 2022

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

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

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

收藏 評論

Nov 05 2025

要出家的鍵盤 - Vue的雙向數據綁定

何為雙向數據綁定？ 雙向數據綁定即為 1、當與用户交互時，用户修改視圖上的數據（如文本框等），model中的數據也會跟着改變； 2、當model數據發生改變時，視圖上渲染了該數據的地方也會跟着更新。 如何實現雙向數據綁定？ 數據劫持、觀察者Observer、訂閲者Watcher、Compile解析器 頁面初次渲染 1、使用遞歸劫持數據，為每個對象以及每個對象的屬性添加gette

vue2 , mvvm , 數據綁定

收藏 評論

Nov 03 2025

qngyun1029 - 模擬elementui輸入框el-input樣式效果

背景： 使用elementui組件時，通常會碰到這類需求，需要el-input一樣的樣式效果，但是不能輸入，卻需要點擊叉叉刪除文字內容，提供的原始屬性無法滿足，所以需要做一些改動。 要求： 1、交互效果和el-input一致； 2、不可輸入，但是可以點擊右側叉叉清空內容； 3、右側叉叉在文本框沒有內容時隱藏，有內容時，鼠標移上去顯示，鼠標移出隱藏； 效果圖如下： 代碼如下：vue 2

vue2 , element-ui

收藏 評論

Nov 05 2025

原諒我一生不羈放歌搞文藝 - vue2 生成動態二維碼

因為項目使用的是vue2，下面那個組件，大佬沒有寫canvas的生成二維碼+logo的形式。 所以跟着大佬的vue3的代碼，寫了一遍vue2的。 vue3 直接安裝使用 npm install qrcode@1 @chenfengyuan/vue-qrcode@2 vue2參考下面 npm install qrcode@1 組件：QrcodeComponent.vue template

vue2 , 組件化

收藏 評論