原创 image-compressors前端圖片壓縮工具

image-compressors compressorSettings.toWidth:結果(壓縮/拉伸)圖像的寬度(以像素爲單位),默認值:100。 compressorSettings.toHeight:結果(壓縮/拉伸)圖像的

原创 瀏覽器緩存

瀏覽器緩存:https://segmentfault.com/a/1190000017962411#articleHeader10

原创 Vue樣式scoped存在的問題

爲了解決css存在的一大痛點:天生全局性,每個通過 vue-cli 創建的 Vue.js 應用都內置了兩個很好的解決方案:Scoped CSS 和 CSS Modules (模塊式 CSS)。現在我們只介紹Scoped CSS. 我們

原创 用js創建一個可拖曳的元素

我們一直使用並且理所當然的常見手勢是能夠在屏幕上拖動元素。儘管這種拖拽手勢有多麼常見,但是沒有很好的內置支持來使網絡上的元素可拖動。如果我們希望超越鼠標並支持觸摸之類的東西,那就更是如此!這就是本教程的用武之地。在接下來的幾節中,我們

原创 wx.getLocalImagData接口的使用時需要注意的點

這篇主要講到wx.getLocalImagData接口的使用時需要注意的點。 wx.getLocalImgData({ localId: '', // 圖片的localID success: function (res) { var

原创 異步調用三部曲

一、回調地獄 getMoreData(a,b => { getMoreData(b,c => { getMoreData(c,d => { getMoreData(d,e => { console.log

原创 javascript格式化數字成K,M等格式

數字格式化成K,M等格式 function nFormatter(num, digits) { const si = [ { value: 1, symbol:

原创 vue2自定義指令directive

除了核心功能默認內置的指令 (v-model 和 v-show),Vue 也允許註冊自定義指令。注意,在 Vue2.0 中,代碼複用和抽象的主要形式是組件。然而,有的情況下,你仍然需要對普通 DOM 元素進行底層操作,這時候就會用到自

原创 收縮按鈕

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®">

原创 webpack之代碼拆分

代碼拆分:就是將代碼分離到不同的bundle中。有三種方式。 懶加載:在交互的時候纔將需要的代碼加載進來。而不是不管需不需要都加載代碼進來。

原创 jsencrypt 對password進行加密

在做項目中的登錄功能時一般是通過form表單或者ajax方式將參數提交到服務器進行驗證,在這個過程中,在前端對登錄密碼先進行一次加密的話,安全性肯定要優於直接提交的方式。 安裝: npm install encryptjs --sav

原创 element-ui同時獲取el-select選中對象中的多個屬性值

<el-form-item label="用戶角色:" prop="userRoleId"> <el-select v-model="form.userRoleId" placeholder="-請選擇-" @chang

原创 使用vue-i18n進行國際化

一、相關資源 vue-i18n官網,csdn上一個可以練手的項目,這裏是github地址,還有博客園上一個寫的不錯的文章。不過看這兩篇文章最後先學過element-ui。 vue-i18n是一個前端國際化的工具,github地址。 兼

原创 css常用知識

css處理元素重疊:需要重疊的元素position屬性都設置爲absolute,z-index值各不相同。 css3在動畫結束時保持狀態不變:animation-fill-mode :forwards 【animation-fill-m

原创 mockjs和easy-mock用法

一、mockjs mockjs官方語法規範 mockjs案例 vue+mockjs十分詳細的教程,有代碼以及目錄結構。 在github有一個後管項目基於mock數據做的,想要參考還是看這個比較好。 –(1)在main.js裏引入mo