原创 iOS textarea標籤 placeholder多行時被隱藏,收起鍵盤又顯示

問題描述 如下圖所示,項目裏用到了textarea及其placeholder屬性。在iOS上輸入文字後刪除,placeholder文字被隱藏了,只能顯示一行,收起鍵盤後又能正常顯示 原因 未知 解決方案 1、思路 動態設置標籤的

原创 js獲取當天零點時間

js獲取當天零點時間 const stamp1 = new Date(new Date().setHours(0, 0, 0, 0)); //獲取當天零點的時間 const stamp2 = new Date(new Date()

原创 js replace方法替換變量

前言 項目中遇到的場景是,需要使用replace方法去匹配變量內容並且替換,比如: let str = 'aaa likes bbb, aaa is a girl', key = 'aaa'; let newStr = str

原创 iOS H5 history.back() 返回上一路由 頁面白屏

問題描述 最近在做H5項目的時候,發現使用history.back()在IOS上返回上一頁的時候,會有很嚴重的bug。我的場景是列表頁滾動了超出一屏之後,進入詳情頁,再點擊返回列表頁,在iOS上就出現了白屏的現象,但是觸屏或者滑一

原创 react-router4實現異步按需加載模塊

前言 按需加載模塊的目的是實現代碼分割,用戶打開首頁時不用下載全部的代碼,打開特定的頁面加載特定的代碼,可以提高用戶體驗 實現 在router4以前,我們是使用getComponent的方式來實現按需加載的,router4中,ge

原创 web設計 & UI交互 & CSS特效網站

Web Design & UI Inspiration with Code Snippets:https://codemyui.com/ Best Web Design Trends: https://www.awwwards.

原创 SplitChunksPlugin簡介及在多入口頁項目中的實踐

SplitChunksPlugin是webpack4中官方plugin,用於做分包打包的,可以幫你把重複引入的模塊按規則打包到指定的js裏面。以下是SplitChunksPlugin的默認配置: splitChunks: {

原创 React中利用 key 實現組件重新渲染

最近在項目實踐中,發現react中可以利用key實現子組件的重新渲染,具體場景:需要切換下拉菜單時,對應的榜單也要替換成該輪的數據 代碼如下 render() { let {round, sid} = this.stat

原创 element-ui使用時的一些坑點總結

1、el-select 下拉框綁定值爲對象時選中值顯示錯亂。如下圖,所有下拉選項都是選中狀態而且不管怎麼選,下拉框顯示的值一直是最後一個選項 解決辦法:加上value-key屬性 官網也有介紹,當綁定值是對象類型是必填 代碼如下,

原创 js 使用預簽名(presigned) url 上傳文件到 AWS S3服務(解決生成的文件格式錯誤問題)

背景 項目裏有圖片上傳的需求,具體實現是後端生成presigned url(預簽名url,裏面包含上傳到AWS S3所需要的一些認證標識信息)給到前端,前端通過這個URL將文件上傳到雲服務上。但是上傳成功後,從CDN上下載下來的文件

原创 axios get方法傳遞數組

axios的get方法中使用params時對於js數組類型的參數的默認操作比較奇怪,會使得參數名後帶上’[]'字符串,如下 但是console.log參數bizType,就是正常的[‘3’,‘4’,‘5’] 按照網上的寫法,把數組j

原创 Vue + Element UI 循環生成checkbox無法選中

背景:需要根據後端返回的數據生成相對應數量的checkbox,並勾選需要更改狀態的數據傳遞給後端,如下圖 HTML部分: <el-checkbox v-model="item.checked" :key="item.id"></e

原创 vue + axios 導出Excel文件流(解決亂碼問題)

後端返回的是文件流,需要前端轉換成Excel文件並下載到本地,具體寫法如下: axios.post('/api/export', qs.stringify(params), {

原创 aos.js介紹及其在react項目中的使用

AOS 是一個用於在頁面滾動的時候呈現元素動畫的工具庫,在頁面往回滾動時,元素會恢復到原來的狀態,效果演示demo鏈接:http://www.jq22.com/yanshi8150 本文主要介紹aos.js在react項目中的使用,網

原创 clipboard.js移動端無法實現複製

clipboard.js簡介:實現了純 JavaScript (無 Flash)的瀏覽器內容複製到系統剪貼板的功能。 在項目中使用clipboard.js插件去實現點擊按鈕,複製文字到剪切板的功能。同樣的代碼,在PC可以實現正常複製但