bui.fileselect Class
选择文件 注意: BUI 1.7开始将废弃掉该原生接口, 请使用对应的原生平台抛出的方法使用
预览地址: demo
选择文件
add: 添加文件remove: 移除添加的文件
clear: 清除所有添加的文件
data: 获取添加的数据
value: 获取上传的文件值
toBase64: 把获取到的本地图片转换成base64位
Constructor
bui.fileselect
-
option
Parameters:
-
optionObject-
[quality]Boolean optional图片的质量, 默认 0.8
-
[width]Boolean optional图片的宽度, 默认 800, 原生是在上传前压缩成800宽度,web是在显示的时候显示为800宽度,需要后台自己压缩
-
[mediaType]String optional文件的类型, picture | video | audio | allmedia | application/zip ,原生只支持图片上传
-
[from]String optional1.4.7新增, 默认 "" 从相册选 | "camera" 相机拍照 | "camcorder" 录像, 需要配合 mediaType 参数
-
[needNative]Boolean optional1.5.1新增, 是否使用原生上传, 不受bui.isWebapp状态决定 默认 false|true 通过这个切换对应的效果,可以通过全局配置 bui.config.fileselect = {needNative:true}
-
Example:
js:
// 1. 初始化, 这里如果有 onSuccess,onFail 则为公共处理方法,添加只需要 uiFileSelect.add();
var uiFileSelect = bui.fileselect();
// 2. 调用 添加文件方法
uiFileSelect.add({
onSuccess: function(files){
// 展示本地图片,部分手机不支持
var url = window.URL.createObjectURL(files[0]);
document.querySelector('img').src = window.URL.createObjectURL(url);
// 展示base64本地图片
// this.toBase64({
// onSuccess: function (url) {
// document.querySelector('img').src = url;
// }
// });
},
onFail: null
})
Item Index
Methods
Methods
add
-
[option]
添加文件, 参数的配置全部针对原生选择
Parameters:
-
[option]Object optional对象
-
[needCompress]Boolean optional1.5.3新增 是否需要压缩, 默认 false | true , true 以下的质量及宽度高度参数才会有效.
-
[quality]Number optional图片质量,默认0.8
-
[width]Number optional图片宽度,默认800
-
[height]Number optional图片高度,默认800
-
[mediaType]String optional文件的类型, picture | video | allmedia (needNative:true 只支持图片上传 )
-
[from]String optional图片来源, 默认来自 "picture"(相册) | camera(相机)
-
[destinationType]String optionalfile (返回路径值) | data (返回base64位值)
-
[onSuccess]Function optional成功的回调
-
[onFail]Function optional失败的回调
-
Example:
uiFileSelect.add({
onSuccess: function(file){
// this 指向uiFileSelect
// console.log(this)
}
})
clear
()
清空所有选择的文件
Example:
uiFileSelect.clear();
currentIndex
()
获取最后选择的文件名,删除的时候
Example:
var currentIndex = uiFileSelect.currentIndex();
currentName
()
获取最后选择的文件名,删除的时候
Example:
var currentName = uiFileSelect.currentName();
data
()
获取所有选择的文件, 原生默认只返回最后一个选择的文件
Example:
var data = uiFileSelect.data();
// 返回 [{ name: "base64.jpg", data: null, type: "jpg" }]
// 其中 data为要上传的文件值
remove
-
name -
[key]
删除选择的文件, 安卓选择后的文件名自动更改为 resize.jpg
Parameters:
-
nameString[ 要删除的图片名字带后缀名 ]
-
[key]String optional图片名字在哪个字段, 默认是 "name"
Example:
uiFileSelect.remove("resize.jpg");
resize
-
[option]
修改图片大小
Parameters:
-
[option]Object optional对象
-
[data]Object optional图片的值, 不传则拿最后选择的文件
-
[quality]Number optional图片质量,默认0.8
-
[width]Number optional图片宽度,默认800
-
[height]Number optional图片高度,默认800
-
[needCompress]Boolean optional是否需要压缩, 默认: true | false
-
[destinationType]String optional更改以后的图片返回什么类型, file (文件类,跟默认一致) | data (返回base64位值) | blob(返回文件流)
-
[onSuccess]Function optional成功的回调,第一个形参为拿到转换后的值
-
[onFail]Function optional失败的回调
-
Example:
uiFileSelect.resize({
onSuccess: function(file){
// this 指向uiFileSelect
// console.log(this)
}
})
toBase64
-
[option]
把选择的图片文件转换成base64地址,可以直接展示在页面上
Parameters:
-
[option]Object optional-
[data]String optional通过文件选择的文件进行转码
-
[needCompress]Boolean optional1.5.1新增,转换成base64以后需要压缩吗 默认 false | true , 为true, mimeType 类型才有效
-
[mimeType]String optional1.5.1新增,转换的图片类型 默认为原图片类型 , "image/jpeg" | "image/png"
-
[onSuccess]Function optional成功的回调
-
[onFail]Function optional失败的回调
-
Example:
// 展示本地图片
uiFileSelect.toBase64({
onSuccess: function (imgurl) {
$("#id").append('<img src="'+imgurl+'" />')
}
});
value
()
获取最后选择的文件
Example:
var value = uiFileSelect.value();
// 返回值 value为要上传的文件值, web上传跟原生上传得到的值不一样