littlelittleship

摘要： js實現pdf文件上傳預覽功能 > 需求: 上傳預覽功能, 支持圖片和pdf上傳預覽, 并且是在指定的div里面預覽 主要使用的是pdfjs庫 pdfjs可以輕松實現點擊打開一個新的頁面或一個大的dialog在原頁面實現預覽, 但是不支持(可能是我沒找到)在指定的div里面預覽 這里要實現的是在指定 閱讀全文

摘要： plugin插件的原理 擴展webpack, 加入自定義的構建行為 webpack內部的鉤子 hooks tap: 可以注冊同步鉤子和異步鉤子 tapAsync: 回調方式注冊異步鉤子 tapPromise: promise方式注冊異步鉤子 Compiler構建對象, 保存著完整的webpack環境 閱讀全文

摘要： loader的基本原理 幫助瀏覽器將不同類型的文件資源轉化為瀏覽器可識別的資源 分類 前置loader: pre 普通loader: normal 內聯loader': inline 后置loader：post 執行順序: pre > normal > inline > post 相同優先級: 從右 閱讀全文

摘要： webpack的基礎用法2 webpack的優化方向 提升開發體驗 提升打包構建速度 減少代碼體積 優化代碼運行性能 SourceMap 生成一個.map文件,形成一個映射, 可以通過錯誤找到源文件 開發模式: cheap-module-source-map 優點: 打包編譯速度快, 值包含行映射 閱讀全文

摘要： webpack的基本使用 webpack 本身功能有限: 開發模式: 僅能編譯JS中的ES Module 語法 生產模式: 能編譯ES Module 語法, 還能壓縮JS代碼 添加實例文件 npm init -y src/main.js // 引用下面export的函數 src/js/add.js 閱讀全文

摘要： vue雙向數據綁定原理實現 準備工作 ? 新建一個index.js文件, 一個index.html文件 ? index.js文件中, 定義Vue類, 并將Vue并稱全局變量 window.Vue = Vue ? index.html中引入index.js ? index.js class Vue({ 閱讀全文

摘要： 組件的虛擬節點 分全局組件 和 局部組件 全局組件 Vue.component('my-button', { template: '<button>點擊</button>' }) 局部組件 const vm = new Vue({ el: '#app', data() { return {name: 閱讀全文

摘要： watch的實現原理 watch和computed一樣, 也是基于 Watcher 的 組件內部使用的watch 和 外部使用的 vm.$watch()都是調用的Vue.prototype.$watch方法 當依賴的屬性發生變化, 更新的時候執行回調就行了 vue'中watch有多種寫法, 這里只簡 閱讀全文

摘要： 計算屬性的實現原理 計算屬性也是一個watcher 計算屬性定義成方法, 使用的時候直接vm.XX,是因為使用Object.defineProperty在vm實例上定義了屬性 計算屬性的依賴更新值發生改變是通過臟值檢測來實現的 計算屬性watcher不能更新視圖, 只會更新里面的dirty屬性,真正 閱讀全文

摘要： 數組更新實現原理 之前我們給每個屬性添加了dep, 讓dep去收集依賴 當使用push方法改變數組的時候, 并沒有改變屬性, 而是改變了數組本身 因此, 需要讓數組,或對象和屬性一樣, 也能收集依賴, 并且在檢測到數組變化的時候觸發更新 在Observer 類中對每一個對象對進行依賴收集 class 閱讀全文