javascript vue專案開發中的常用公共方法
阿新 • • 發佈:2019-01-11
本篇文章純屬乾貨,包含了筆者在實際專案開發中經常用到的一些公共通用方法,希望可以幫助大家。
部分方法適用ReactNative
import { PixelRatio, Dimensions, Platform, findNodeHandle, UIManager } from 'react-native'; /** * 日期格式化函式 * @param {} date */ function formatNumber(n) { n = n.toString() return n[1] ? n : '0' + n } export function formatDate(date, type) { var year = date.getFullYear() var month = date.getMonth() + 1 var day = date.getDate() var hour = date.getHours() var minute = date.getMinutes() var second = date.getSeconds() if (type = 'YYYY-MM-DD') { return [year, month, day].map(formatNumber).join('-') } else { return [year, month, day].map(formatNumber).join('-') + ' ' + [hour, minute, second].map(formatNumber).join(':') } } //獲取裝置螢幕的實際寬度 export const deviceW = Dimensions.get('window').width; export const deviceH = Dimensions.get('window').height; // 設定自適應字型,以iphone6為例 const basePx = 375 export function px2dp(px) { return px * deviceW / basePx } /** * 判斷是否為iphoneX * @returns {boolean} */ const X_WIDTH = 375; const X_HEIGHT = 812; export function isIphoneX() { return ( Platform.OS === 'ios' && ((deviceH === X_HEIGHT && deviceW === X_WIDTH) || (deviceH === X_WIDTH && deviceW === X_HEIGHT)) ) } /** * 根據是否是iPhoneX返回不同的樣式 * @param iphoneXStyle * @param iosStyle * @param androidStyle * @returns {*} */ export function ifIphoneX(iphoneXStyle, iosStyle, androidStyle) { if (isIphoneX()) { return iphoneXStyle; } else if (Platform.OS === 'ios') { return iosStyle } else { if (androidStyle) return androidStyle; return iosStyle } } //判斷裝置是否是ios平臺 export const isIphone = Platform.OS == 'ios' ? true : false /** * 返回精確的n位小數數值 * @param num:number * @param dig:number */ export function digitToFixed(num, digit = 2) { // NaN,undefined,空值 if (typeof (num) == 'undefined') { return '0.00' } else { return parseFloat(num).toFixed(digit) } } /** * 返回賬戶金額,每隔三位數字新增一個逗號 * @param str:string */ export function threeNumberAPointer(str) { return parseFloat(str).toFixed(2).replace(/\d(?=(?:\d{3})+\b)/g, `$&,`) } /** * 將銀行卡末尾n位數字截取出來 * @param cardCode:string 銀行卡號 * @param digit:num 擷取長度 */ export function bankCardLastNum(cardCode, digit = 4) { return cardCode.substring(cardCode.length - digit, cardCode.length) } /** *獲取react-native-element元素的寬度和高度等資訊 * @param ref:ref 元件ref */ export function getRnElementInfo(ref) { const handle = findNodeHandle(ref); return new Promise((resolve) => { UIManager.measure(handle, (x, y, width, height, pageX, pageY) => { resolve({ x, y, width, height, pageX, pageY }); }); }); } /** * 返回銀行卡號,每隔四個數字新增一個空格 * @param str:string */ export function formatBankCard(str) { let newStr = str.replace(/\d(?=(?:\d{4})+\b)/g, `$& `); // let subStr = String(newStr).subStr(0,len-4) return String(newStr) } //判斷引數的型別 const Types = { isPrototype( data ) { return Object.prototype.toString.call(data).toLowerCase() }, isArray( data ) { return this.isPrototype( data ) === '[object array]' }, isJSON( data ) { return this.isPrototype( data ) === '[object object]' }, isFunction( data ) { return this.isPrototype( data ) === '[object function]' }, isString( data ) { return this.isPrototype( data ) === '[object string]' }, isNumber( data ) { return this.isPrototype( data ) === '[object number]' }, isUndefined( data ) { return this.isPrototype( data ) === '[object undefined]' }, isNull( data ) { return this.isPrototype( data ) === '[object null]' } }