uniapp开发必备：10个实用Utils方法全解析，熬夜也要学

uniapp开发必备：10个实用Utils办法全剖析，熬夜也要学

uniapp常用的utils办法包含删除数组中指定元素、验证手机号、手机号脱敏、反省文件后缀典范、保存视频文件、保存图片、时间转换、时间前方补0、视频分享和图片分享。

以下是这些办法的具体分析和使用案例：

1、删除数组中指定元素：

• 办法名：removeElementFromArray
• 参数：array（要利用的数组）
• 参数：element（要删除的元素）
• 前往值：删除指定元素后的新数组
• 使用案例：

/** 删除数组中指定元素 */
export function removeElementFromArray(array, element) {
return array.filter((item) => item !== element);
}
const array = [1, 2, 3, 4, 5];
const element = 3;
const newArray = removeElementFromArray(array, element);
console.log(newArray); // [1, 2, 4, 5]

2、验证手机号：

• 办法名：validatePhoneNumber
• 参数：phoneNumber（要验证的手机号）
• 前往值：验证后果（true表现手机号格式准确，false表现手机号格式错误）
• 使用案例：

/** 验证手机号 */
export function validatePhoneNumber(phoneNumber) {
const phonePattern = /^1\d{10}$/
return phonePattern.test(phoneNumber)
}
const phoneNumber = '13812345678';
const isValid = validatePhoneNumber(phoneNumber);
console.log(isValid); // true

3、手机号脱敏：

• 办法名：maskPhoneNumber
• 参数：phoneNumber（要脱敏的手机号）
• 前往值：脱敏后的手机号（前三位保存，正中用****交换，后四位保存）
• 使用案例：

/** 手机号脱敏 */
export function maskPhoneNumber(phoneNumber) {
if (!phoneNumber) {
return ''
}
const maskedNumber = phoneNumber.substring(0, 3) + '****' + phoneNumber.substring(7);
return maskedNumber;
}
const phoneNumber = '13812345678';
const maskedNumber = maskPhoneNumber(phoneNumber);
console.log(maskedNumber); // 138****5678

4、反省文件后缀典范：

• 办法名：checkFileExtension
• 参数：file（文件途径）
• 前往值：文件典范（isVideo为true表现视频文件，isImg为true表现图片文件，不然为其他典范文件）
• 使用案例：

/** 反省后缀典范 */
export function checkFileExtension(file) {
const imageExtensions = ['.jpg', '.jpeg', '.png', '.gif', '.bmp'];
const videoExtension = '.mp4';
const fileExtension = file.substring(file.lastIndexOf('.')).toLowerCase();
const isVideo = (fileExtension === videoExtension);
const isImg = imageExtensions.some(ext => ext === fileExtension);
return {
isVideo,
isImg,
};
}
const file = 'test.jpg';
const fileType = checkFileExtension(file);
console.log(fileType); // {isVideo: false, isImg: true}

5、保存视频文件：

• 办法名：downloadVideo
• 参数：file（视频文件途径）
• 功效：保存视频得手机相册
• 使用案例：

/** 保存视频文件 */
export function downloadVideo(file) {
uni.showLoading({
title: '保存中...'
});
uni.authorize({
/* scope.writePhotosAlbum 典范是保存到相册 */
scope: 'scope.writePhotosAlbum',
success() {
uni.downloadFile({
url: file,
success: (res) => {
uni.hideLoading()
uni.saveVideoToPhotosAlbum({
filePath: res.tempFilePath,
success: function() {
showSuccessToast('视频保存告捷');
},
fail: function() {
showErrorToast('视频保存失败');
}
})
},
});
}
})
}
// 告捷提示
export function showSuccessToast(message) {
uni.showToast({
title: message,
icon: 'success',
duration: 2000
});
}
// 失败提示
export function showErrorToast(message) {
uni.showToast({
title: message,
icon: 'error',
duration: 2000
});
}
const url = 'http://example.com/video.mp4';
shareVideo(url);

6、保存图片：

• 办法名：downloadImage
• 参数：file（图片途径）
• 功效：保存图片得手机相册
• 使用案例：

/** 保存图片 */
export function downloadImage(file) {
uni.showLoading({
title: '保存中...'
});
uni.authorize({
/* scope.writePhotosAlbum 典范是保存到相册 */
scope: 'scope.writePhotosAlbum',
success()
uni.getImageInfo({
src: file,
success: function(image) {
uni.hideLoading()
uni.saveImageToPhotosAlbum({
filePath: image.path,
success: function() {
showSuccessToast('图片保存告捷');
},
fail(e) {
showErrorToast('图片保存失败');
}
});
}
});
}
})
}
const file = 'http://example.com/image.jpg';
downloadImage(file);

7、时间转换：

• 办法名：convertSecondsToFormat
• 参数：seconds（时间，单位为秒）
• 前往值：转换后的时间格式（小时、分钟、秒钟）
• 使用案例：

/** 时间转换 */
export function convertSecondsToFormat(seconds) {
if (typeof time !== 'number' || time < 0) {
return time
}
let hours = Math.floor((seconds % (24 * 60 * 60)) / (60 * 60));
let minutes = Math.floor((seconds % (60 * 60)) / 60);
let remainingSeconds = seconds % 60;
return {
hours: addZero(hours),
minutes: addZero(minutes),
seconds: addZero(remainingSeconds),
};
}
/** 时间前方补0 */
export function addZero(value) {
return value < 10 ? "0" + value : value;
}
const seconds = 3600;
const timeFormat = convertSecondsToFormat(seconds);
console.log(timeFormat); // {hours: '01', minutes: '00', seconds: '00'}

8、视频分享：

• 办法名：shareVideo
• 参数：url（视频地点）
• 功效：下载视频并分享
• 使用案例：

/** 视频分享 */
export function shareVideo(url) {
wx.downloadFile({
url: url, // 下载url
success(res) {
// 下载完成后转发
wx.shareVideoMessage({
videoPath: res.tempFilePath,
success() {},
fail: console.error,
})
},
fail: console.error,
})
}
const url = 'http://example.com/video.mp4';
shareVideo(url);

9、图片分享：

• 办法名：shareImage
• 参数：url（图片地点）
• 功效：下载图片并分享
• 使用案例：

/** 图片分享 */
export function shareImage(url) {
wx.downloadFile({
url: url,
success: (res) => {
wx.showShareImageMenu({
path: res.tempFilePath,
success() {},
fail: console.error,
})
}
})
}
const url = 'http://example.com/image.jpg';
shareImage(url);

假如喜好，可以点赞保藏，眷注哟~