»
019. fetch
当前的浏览器都已经支持fetch函数。这又是一个用原生js的简单函数替代jQuery的理由。
fetch函数也就是原生的ajax函数,使用的是Promise,不使用回调函数。它的使用方式以动态文件上传为例:
var abortController = new AbortController();//用户取消控制器
var signal = abortController.signal;//fetch中用到的属性
fetch(url, {
method: 'POST',
body: file,
onprogress: (event) => {
console.log('正在上传');
if(event.lengthComputable){
const percent = event.loaded / event.total;
console.log(`已完成:${percent}`);
}
},
onerror: (event) =>{
console.log('上传出错');
},
signal//用户取消控制器中的属性
}).then(res=>{
console.log('上传成功');
}).catch(err=>{
console.log('上传失败');
if(err.name == "AbortError"){
console.log('用户取消');
}else{
console.log('其他原因,上传失败:'+err);
}
});
在上传过程中,用户可以通过调用以下方法来取消进行中的上传操作:
abortController.abort();//调用用户取消控制器中的abort()方法来控制退出上传过程
————www.v-signon.com学习者共勉