原创 ES6讀書筆記彙總系列(一)

前言 溫故而知新,可以爲師矣. 相信大家都會有這種感覺,很多學過的知識經常不使用就會慢慢遺忘!!!本文把以前自己關於 ES6的入門讀書筆記重新彙總了一下,並結合了工作中常用的使用場景... 變量聲明方式 let,const ES5中聲明變量

原创 Vue中 render 函數應用

前言 因爲最近接手維護一個基於 ivew 的項目, 新增模塊中包含很多自定義功能, 所以大量使用到了 render 函數; 故對其做一下總結...關於 render 函數, 官方文檔也做了比較詳細的介紹: render 函數: https:

原创 前端工程化之規範化

前言 前段工程化主要目的就是提高團隊的生產效率,可以理解爲凡事能提升團隊開發效率的規範,準則,工具啥的都可以歸納到前端工程化裏面來; 最近也花了點時間把前端 team 的基本規範梳理了一下, 這裏做一下總結. 現階段我把工程化主要分爲三大

原创 搭建前端自動集成環境

前言 告別手動打包部署到服務器, 搭建自動集成環境...這裏採用的是 gitlab-ci 工具 服務器配置 gitlab-runner 1.安裝gitlab-ci-multi-runner 參考: https://mirrors.tuna.

原创 JS原型那些事兒

本篇主要是記錄一下對js中對於原型的理解... 原型 原型涉及到構造函數, 原型對象, 實例化對象三者之間的關係... 構造函數 function Person (name,age) { //(1)創建一個空對象:

原创 vue項目接入mock&& axios 通用配置

前言 兵馬未動,糧草先行; 同理,項目開發過程中經常會出現接口未出, 前端頁面已搭建完畢的情況;此時爲了提高前端的開發效率,解放生產力,我們 FE 可以按照預定的接口文檔做一些接口模擬的工作,等等後端小夥伴開發完接口後我們只需要替換一個接口

原创 vue中的過渡動畫

前言 記一次vue 組件中使用 transition 和 transition-group 設置過渡動畫,總結來說可分爲分爲 name 版, js 鉤子操作類名版, js 鉤子操作行內樣式版... template模板結構 // 單個元

原创 一次設置過期時間引發的思考

前言 開發過程少不了會遇到給某個狀態設置過期時間的需求,例如:進入頁面有個默認彈窗,用戶關閉之後在 1 小時之內再次打開不能再彈; 面對這樣需求我們首先想到的是需要設置一個變量去控制彈窗的隱藏(因爲默認是開啓的), 如何去保證這個變量的有效

原创 vue 中的slot 和 mixins

前言 vue 爲我們提供了很多複用性的方式,slot 和 mixins 就是其中兩種...下面對這兩種方式做一下記錄 插槽使用場景 - 該組件被多個地方使用 - 每個父組件中對該組件的內部有一部分需要特殊定製 - slot可以讓我們更好的複

原创 vue實現自定義H5視頻播放器的方法步驟

這篇文章主要介紹了vue實現自定義H5視頻播放器的方法步驟,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨着小編來一起學習學習吧 前言 前段時間基於vue寫了一個自定

原创 vue實現自定義H5視頻播放器

前言 前段時間基於vue寫了一個自定義的video播放器組件,踩了一些小坑, 這裏做一下覆盤分享出來,避免日後重複踩坑... 設計階段 這裏就直接放幾張完成後的播放狀態圖吧,界面佈局基本就是flex+vw適配一把梭,也比較容易. 需要

原创 H5中video標籤那些屬性和方法

前言 最近在寫一個自定義播放器, 寫之前我們肯定要把播放器的屬性和方法全部過一遍,知彼知己,方能百戰不殆嘛...後面會把自己寫的播放器和踩過的一些坑也上傳上來 video標籤行內屬性 src:視頻的URL poster:視頻封面,沒有播放時

原创 H5喚醒App之scheme方案

前言 寫移動端頁面精彩遇到喚醒App的需求, 一般都是通過scheme協議喚起的,這裏記錄一下 代碼片段 以新浪微博爲例: 其協議爲 sinaweibo://splash; 這些協議需要自己去收集,或者去官方查詢; 有些App分IOS和An

原创 基於better-scroll的vue滾動組件

寫在前面 由於最近一個移動端項目中許多地方有滾動需求, 橫向,縱向的都有,所以就基於better-scroll封裝了一個通用的滾動組件,期間也踩了一些坑,有時候會滾動失效,初始化的時候就不能滾動等等...better-scroll地址: h

原创 滑動驗證碼識別

寫在前面 現在,很多網站採取各種各樣的措施來反爬蟲,其中之一就是使用驗證碼。當我們訪問網頁時,必須先通過驗證碼才能夠訪問頁面。下面我們便來講2種驗證碼的識別方式和一些思路。當然我們也可以直接使用付費的打碼平臺,那樣可以增加識別的準確度,畢竟