YUP是一个流行的JavaScript表单验证库,用于验证用户输入的数据。它可以轻松地验证文件大小和格式。下面是关于使用YUP验证文件大小和格式的完善答案:
文件大小验证:
YUP提供了一个内置的file
方法,可以用于验证文件的大小。可以通过maxSize
方法设置文件的最大大小限制,单位可以是字节、千字节、兆字节等。以下是一个示例代码:
import * as Yup from 'yup';
const schema = Yup.object().shape({
file: Yup.mixed().test('fileSize', '文件太大', (value) => {
if (!value) return true; // 允许为空
return value.size <= 1024 * 1024; // 最大1MB
}),
});
// 使用示例
const data = {
file: // 从表单中获取的文件对象
};
schema.validate(data)
.then(() => {
// 验证通过
})
.catch((error) => {
// 验证失败,处理错误信息
console.log(error.message);
});
文件格式验证:
YUP还提供了一个file
方法的mimeType
链式方法,用于验证文件的格式。可以通过传递一个正则表达式或字符串数组来指定允许的文件格式。以下是一个示例代码:
import * as Yup from 'yup';
const schema = Yup.object().shape({
file: Yup.mixed().test('fileFormat', '不支持的文件格式', (value) => {
if (!value) return true; // 允许为空
return ['image/jpeg', 'image/png'].includes(value.type); // 仅支持JPEG和PNG格式
}),
});
// 使用示例
const data = {
file: // 从表单中获取的文件对象
};
schema.validate(data)
.then(() => {
// 验证通过
})
.catch((error) => {
// 验证失败,处理错误信息
console.log(error.message);
});
这样,通过使用YUP的file
方法的maxSize
和mimeType
链式方法,可以轻松地验证文件的大小和格式。
腾讯云相关产品推荐:
请注意,以上答案仅供参考,实际应用中可能需要根据具体情况进行调整和修改。
领取专属 10元无门槛券
手把手带您无忧上云