原创 在PC項目中將上傳的文件(word, excel, pdf)直接在項目中預覽

思路: 可以使用任何方式將本地文件上傳到後端得到一個地址後使用iframe直接在項目中展示出來 代碼實現 <iframe title="1"

原创 js將內容複製到剪切板(最簡單的實現方式)

content:爲要設成的文本 // 創建元素用於複製 const aux = document.createElement('input') // 獲取複製內容 const content = v

原创 使用lodash或純js把數組對象中相同的字段的值合併

1. lodash解決辦法 1.1 數組內對象型數據 let fruitSamples = [ { id: 1, type: 'apples', samples: [{ id: 1, name: 1 }] }, {

原创 使用lodash進行數組對象去重---最簡單的數組去重

var list= [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }, { 'x': 1, 'y': 2 }]; list = _.uniqWith(list, _.isEqual) // => [{ 'x':

原创 使用 antd scrollToFirstError無效

4版本的form 官方Form API 不再需要使用getFieldDecorator綁定字段 在<Form.Item name="field">使用name字段即可 validateFieldsAndScroll校驗滾動也變成了 scro

原创 項目中使用ECharts,echarts-liquidfill 水球圖 更多配置請參考官方大大https://github.com/ecomfe/echarts-liquidfill

安裝 npm install echarts-liquidfill npm install --save echarts-for-react npm install --save echarts 如果出現這樣的報錯 npm WARN

原创 用正則截取、判斷文件類型(持續更新)

1、截取兩個字符串之間的內容: let str = "aaabbbccc"; let result = str.match(/aaa(\S*)ccc/)[1]; // bbb 2、截取某個字符串前面的內容: let str = "aaab

原创 React中使用Highcharts實現立體餅圖

前言 在一個項目中做餅狀圖、柱狀圖、水球圖,剛開始是藉助echarts做的後來客戶方說平面的覺得不好看非要立體圖類似於3D效果(感官上看着有3D的感覺),無奈下開始翻閱echarts各個屬性看是否能夠通過配置屬性來改變感官效果,後來經過一般

原创 項目中使用ECharts 水球圖 更多配置請參考官方大大https://github.com/ecomfe/echarts-liquidfill

安裝 npm install echarts-liquidfill npm install --save echarts-for-react npm install --save echarts 如果出現這樣的報錯 npm WARN

原创 在項目中獲取外網IP以及IP所在地等信息

先介紹幾個用於單一獲取IP的第三方api用於請求之後等到自己的IP地址(可以直接點擊查看自己的IP) http://ifconfig.me/ip http://ipinfo.io/ip https://ifconfig.co/ip h

原创 JS 使用加密工具對數據進行加密解密

前言:在數據交互的過程中難免會使用數據加密的方式進行數據傳輸,其主要的數據傳輸時使用加密的比較多的是登錄模塊,用戶的密碼等重要信息一旦暴漏將會給用戶帶來不可估量的損失,還有就是將一些信息存儲到cookie,localStorage,sess

原创 稍加特色的二維碼

前言:該插件正在測試階段並且還在不斷的添加各種新的絢麗多彩的形式敬請期待!老規矩附上github地址(https://github.com/ciaochaos/qrbtf),更多屬性請安裝插件後通過點擊Ctrl+單擊進行查看,因爲該插件還不

原创 正則截取指定內容之間的內容

1、js截取兩個字符串之間的內容: let str = "aaabbbfff"; let result = str.match(/aaa(\S*)fff/)[1]; // bbb 2、js截取某個字符串前面的內容: let str = "

原创 React使用視頻播放

1. 安裝依賴(附官方地址https://video-react.js.org/) npm install --save video-react 2. 引入樣式文件 使用css引入 import "node_modules/video-re

原创 使用高德api實現對經緯度和地址的互換

需求:對用戶輸入的地址在高德地圖上進行定位顯示 運用技術棧:React+TS 請求方式:axios 操作平臺:Web 地址轉經緯度 1. 封裝 /** * 將地址轉換爲經緯度 * @param address : 地址