原创 移動端常用事件

touchstart 與 click touchstart : 觸摸開始事件,當手指接觸屏幕上的一剎那,觸發該事件。 click: PC端點擊事件,在移動端也可以使用,不過會有200ms延遲,一般不建議使用。 var box

原创 原生js模擬vue實現雙向數據綁定

原生js模擬vue實現雙向數據綁定 寫在前面 vue.js是mvvm模式的框架,如圖: 通過和傳統mvc模式的對比,我們發現多了個ViewModel,沒有控制器(controller)了。ViewModel是mvvm模式的精髓

原创 js經典設計模式--發佈訂閱模式

什麼是發佈-訂閱模式 發佈—訂閱模式又叫觀察者模式,它定義對象間的一種一對多的依賴關係,當一個對象的狀態發生改變時,所有依賴於它的對象都將得到通知。 舉個例子,售樓處賣房,那麼售樓處要發佈房型信息,那麼它是發佈者,中介關注房型,所

原创 vue 路由攔截

爲什麼要設置路由攔截 1.有些頁面組件頁面需要登錄才能操作,不然會發生不可預知的錯誤 2.根據用戶權限配置頁面,若沒有這個權限,則你無法進入,進行攔截 1.路由設置:router/index.js export default n

原创 vue 路由懶加載 總路由配置動態引入

一般的方式 import shopRoutes from ‘./shop/index.routes.js’; import storeRoutes from ‘./store/index.routes.js’; import pr

原创 vue api層封裝 axios封裝(大廠案例)

爲什麼要封裝axios 有一定設計思想的同學,應該會有個意識,我們前端的api層與業務層應該是分離的。 否則業務層會特別混亂,我們要實現的目標是業務層只調用方法,返回接口數據。其餘的都交給api層來做。那我們具體應該怎麼設計呢?

原创 vue 全局權限控制

說在前面 權限控制一直是一個很煩人的事情,無論是前端還是後臺。 在平常的項目裏,可能大家都是通過後臺傳來的字段來控制元素的display屬性。 其實這麼做是很不嚴謹的。 因爲可以通過F12查看元素,也可以進行更改,這個時候如果把d

原创 vue-cli3打包優化

vue-cli3.0相對於2.0,已經給我們優化了很多了,大家可以打開項目裏的node_modules,找到@vue/cli-serve, 這裏也說一點,如果你想更深入的瞭解vue而不僅僅是停留在應用層是一定要去看這些node_modul

原创 手把手教你寫vue插件

組件與插件的區別 組件: 對某功能或某模塊的封裝(例如 我們寫的彈窗,loading) 插件: 對一系列組件的封裝(例如 vuex,vue-router) 關係: 插件可以封裝組件,組件暴露數據給插件 插件的優點 1.開箱即用 2