個人中心PERSONAL CENTER
現在關于講述scrollTop、clientHeight、 scrollHeight 的內容講的都不深，這篇文章就深入了解下。這篇文章主要給大家講述下這些概念的理解，并總結了這些概念彼此之間的數量關系和應用場景。 1.clientWidth、clientHeight、clientLeft、clientTop 1...
當你遇見前端頁面開發完成，可后端接口還沒好，I這樣就直接無法聯調，這時候我們用到mock數據。 先說說curd接口模擬 注：這邊可以和后端先約定好接口路徑以及入參返參的字段，避免二次修改 1.我們先看看下面代碼，在安裝，新建js文件，在文件中...
React實現輪播圖效果如下： 終于可以用上react-slick組件，安裝： npminstallreact-slick--save npminstallslick-carousel 當安裝完后，就要導入css文件，主要是為了使用輪播圖的頁面上： importS...
實現輪播圖自動切換就用JS，先看效果圖 第一種 //點擊按鈕，序號變化 showIdx++; if(showIdx==imgArr.length){ showIdx=0; } //所有盒子左移動 for(leti=0;&...
項目中要求實現左右點擊切換圖片，先看看想要展示效果： 效果： HTML <!DOCTYPEhtml> <html> <head> <metacharset="utf-8"> <title>xxx——空間相冊</title> <linkrel="styleshee...
本篇文章主要向大家介紹關于JavaScript實現購物車效果的具體代碼，直接看下面： HTML： <!DOCTYPEhtml> <html> <head> <metacharset="utf-8"> <title></title> <styletype="text...
現在客戶來了一個項目簡況：有一個業務場景是添加門店的地址和經緯度，地址可以輸入，參考用經緯度當然不行，目前有最好方式就是讓用戶在地圖上搜索或者直接點擊獲取點的經緯度等詳細信息。現在我們就看具體的內容。 登錄高德開放平臺 創建應用，添...
之所以講這篇文章主要是為了加深對 React hooks 的理解。 因此，先要學習如何抽象自定義 hooks。構建屬于自己的 React hooks 工具庫。 且培養閱讀學習源碼的習慣，工具庫是一個對源碼閱讀不錯的選擇。 現在看下ahooks 是怎么封裝 cookie/localSt...
在工作中效率要求是很高的，現在就在頻繁用到復選框，我們自己來寫了個組件，增加其復用性，提高效率。 先看效果圖： 這樣只需提交后得到一個選中項的id組成的數組 下邊直接上代碼： 代碼地址為：components/checkGrop/checkGrop wxml: ...
我們講下 ahooks 的核心 hook —— useRequest。 useRequest 簡介 根據官方文檔的介紹，useRequest 是一個強大的異步數據管理的 Hooks，React 項目中的網絡請求場景使用 useRequest ，這就可以。 useRequest通過插件式組織代碼...
大家會發現，自從 React v16.8 推出了 Hooks API，前端框架圈并開啟了新的邏輯復用的時代，從此無需在意 HOC 的無限套娃導致性能差的問題，同時也解決了 mixin 的可閱讀性差的問題。這里也有對于 React 最大的變化是函數式組件可以有自己的狀態，扁平化的...
在項目開發中，會要求在小程序有時使用下拉框選項。在通常思路就是用 picker 組件實現。pick 組件使用 mode 來區分類別，默認使用普通選擇器就行。 還有另一個方法就是可以通過自定義組件實現，代碼如下： //index.js Component({ /** ...
想必大家都能看得懂的源碼 ahooks 整體架構篇，且可以使用插件化機制優雅的封裝你的請求hook，現在我們就探討下ahooks 是怎么解決 React 的閉包問題的？。 React 的閉包問題 先來看一個例子： importReact,{useState,us...
nvm(全名node.js version management)，是一個node的版本管理工具，它和npm不同點在于，它是依賴包的管理工具。 它主要是用來解決不同項目所需node.js版本不一致時管理的麻煩，舉例，hexo主題，不同的主題需要的nodejs版本不一致，假如沒有管理的話，...
微信小程序中課程選擇器如何實現？先看看實現效果： 代碼如下 wxml <viewclass="urg_input"> <pickerclass="gradePicker"mode="multiSelector"bindchange="bindMultiPickerChange"bindc...
