原创 解決微信小程序長頁面滾動到底部點擊底部的輸入框後輸入框漂浮且頁面滾動到頂部

一、問題描述 項目中有一個長頁面上部展示部分信息下部爲信息錄入,頁面長度爲三屏幕(不同手機屏幕大小略有差異),當滾動到第二屏或者第三屏去填寫信息時點擊輸入框後輸入框漂浮起來了並且頁面向上滾動了一段距離,回到了第一屏中展示的內容。效果如圖。

原创 【核心基礎知識】如何管理CSS代碼

儘管 CSS 提供了 import 命令支持文件引用,但由於其存在一些問題(比如影響瀏覽器並行下載、加載順序錯亂等)導致使用率極低。更常見的做法是通過預處理器或編譯工具插件來引入樣式文件。 將樣式文件進行分類,把相關的文件放在一起,讓工程

原创 【核心基礎知識】CSS的關鍵:佈局

通常提到的佈局,有兩個共同點: 大多數用於 PC 端,因爲 PC 端屏幕像素寬度夠大,可佈局的空間也大; 佈局是有限空間內的元素排列方式,因爲頁面設計橫向不滾動,縱向無限延伸,所以大多數時候討論的佈局都是對水平方向進行分割。 我們在討論佈

原创 【核心基礎知識】3個場景的DOM事件處理

一、防抖 在一段時間內能夠多次觸發並且在最後一次觸發纔是能夠得到完整結果的事件可以使用防抖來防止事件處理函數的多次執行以提升體驗和性能。 比如:有一個搜索輸入框,爲了提升用戶體驗,希望在用戶輸入後可以立即展現搜索結果,而不是每次輸入完後還

原创 基於wx.request封裝的帶日誌輸出的http請求工具

在小程序中請求接口的唯一方式是調用wx.request接口,該api被調用後把請求數據交由微信客戶端轉發去請求服務器端接口;除了此接口沒有其他能夠實現請求接口的方式方法。 wx.request接口使用起來不太方便。接口調用失敗的時候可以不

原创 Jenkins項目配置構建時自動生成版本號

Jenkins是非常流行的持續集成工具。使用Jenkins部署服務器端應用程序是非常方便的,在使用Jenkins構建項目的過程中對項目指定版本號以生成不同版本的構建包也是項目構建的一大需求。 一、準備 服務器上已經安裝並配置好了Jenki

原创 微信小程序中圖片壓縮的最佳實現與封裝

一、概述 在項目開發過程中遇到一個需要從小程序上傳圖片的需求,此需求實現起來並不難,只需要調用chooseImage接口拿到圖片的臨時路徑然後調用uploadFile接口進行上傳。到這裏這個功能已經實現了,可是這樣簡單實現了之後用戶在使用

原创 解決vue項目在development模式下ie11、ie10 出現語法錯誤的問題

一、前言 開發vue項目過程中,在development模式下發現在IE10,、IE11中無法運行,打開控制檯發現已經報錯。錯誤信息提示語法錯誤,打開定位到的報錯位置,可以發現是嚴格模式報錯。編譯的代碼中出現嚴格模式可能是因爲代碼中存在e

原创 【核心基礎知識】你不知道的HTML標籤

有一些非常重要卻容易被忽視的標籤,這些標籤大多數用在頁面頭部 head 標籤內,雖然對用戶不可見,但如果在某些場景下,比如交互實現、性能優化、搜索優化,合理利用它們就可以達到事半功倍的效果。 一、實現交互 在實現一個功能的時候,我們編寫的

原创 【核心基礎知識】高效的操作DOM元素,避免性能陷阱

爲什麼說 DOM 操作耗時?要解釋 DOM 操作帶來的性能問題,我們不得不提一下瀏覽器的工作機制。 一、瀏覽器的工作機制 1、線程切換 瀏覽器包含渲染引擎(也稱瀏覽器內核)和 JavaScript 引擎,它們都是單線程運行。單線程的優勢是

原创 使用Jenkins自動化部署Vue.js項目——兼容Vue CLI3生成的項目

Jenkins是非常流行的持續集成工具。使用Jenkins部署服務器端應用程序是非常方便的,那麼使用Jenkins部署web前端應用程序效果怎麼樣呢,如果可以使用Jenkins部署,那麼就可以直接從版本庫自動拉取,自動構建,相比傳統方式會

原创 最完整的webpack Dll打包與採坑總結

webpack已經成爲前端主流的項目打包工具,對於前端開發必不可少。在前端項目依賴第三方庫過多,項目比較大文件比較多時,webpack打包的速度也會被拖成蝸牛,是時候優化一下webapck的打包速度了。在優化打包速度方面有不少方法方式,其

原创 如何修改create-react-app創建的項目的開發環境端口和自動啓動瀏覽器

使用create-react-app創建的項目在使用npm start命令時啓動的開發環境server端口爲3000並且會自動啓動瀏覽器。本文討論一下如何修改端口和禁止自動啓動瀏覽器。 一、修改端口 沒有修改端口時啓動後端口爲3000,那