常量变量外部函数 Javascript
Const variable outside function Javascript
我有多个导出函数来处理 API 请求。我遇到了一些问题。
请在这里阅读我的代码:
export const CreateAPI = (path, dataForm) => {
const loading = document.querySelector('.loading-bar');
loading.classList.add('is-loading');
return Axios.post(`${process.env.REACT_APP_API_SERVER}${path}`, dataForm, {
headers: { 'Content-Type': 'multipart/form-data' }
})
.then(res => {
if (res.status >= 200 && res.status <= 299) {
loading.classList.remove('is-loading');
return res.status
} else {
Promise.reject(res);
}
})
.catch(err => console.log(err));
}
export const ReadAPI = (path, params) => {
const loading = document.querySelector('.loading-bar');
loading.classList.add('is-loading');
return Axios.get(`${process.env.REACT_APP_API_SERVER}${path}${params || ''}`)
.then(res => {
if (res.status >= 200 && res.status <= 299) {
loading.classList.remove('is-loading');
return res.data
} else {
Promise.reject(res);
}
})
.catch(() => {
localStorage.removeItem('jwtToken');
window.location.href = './login';
});
}
如何使 const 加载可重复用于任何导出函数?
是这样的吗?顺便说一句,您可以将加载服务提取到单独的文件中。
简单fiddle来演示这个想法。
https://jsfiddle.net/ramseyfeng/hpaLn9kj/10/
const loading = document.querySelector('.loading-bar');
loading.start = () => {
loading.classList.add('is-loading');
};
loading.stop = () => {
loading.classList.remove('is-loading');
};
export const CreateAPI = (path, dataForm) => {
loading.start();
return Axios.post(`${process.env.REACT_APP_API_SERVER}${path}`, dataForm, {
headers: { 'Content-Type': 'multipart/form-data' }
})
.then(res => {
if (res.status >= 200 && res.status <= 299) {
loading.stop();
return res.status
} else {
Promise.reject(res);
}
})
.catch(err => console.log(err));
}
export const ReadAPI = (path, params) => {
loading.start();
return Axios.get(`${process.env.REACT_APP_API_SERVER}${path}${params || ''}`)
.then(res => {
if (res.status >= 200 && res.status <= 299) {
loading.stop();
return res.data
} else {
Promise.reject(res);
}
})
.catch(() => {
localStorage.removeItem('jwtToken');
window.location.href = './login';
});
}
我有多个导出函数来处理 API 请求。我遇到了一些问题。
请在这里阅读我的代码:
export const CreateAPI = (path, dataForm) => {
const loading = document.querySelector('.loading-bar');
loading.classList.add('is-loading');
return Axios.post(`${process.env.REACT_APP_API_SERVER}${path}`, dataForm, {
headers: { 'Content-Type': 'multipart/form-data' }
})
.then(res => {
if (res.status >= 200 && res.status <= 299) {
loading.classList.remove('is-loading');
return res.status
} else {
Promise.reject(res);
}
})
.catch(err => console.log(err));
}
export const ReadAPI = (path, params) => {
const loading = document.querySelector('.loading-bar');
loading.classList.add('is-loading');
return Axios.get(`${process.env.REACT_APP_API_SERVER}${path}${params || ''}`)
.then(res => {
if (res.status >= 200 && res.status <= 299) {
loading.classList.remove('is-loading');
return res.data
} else {
Promise.reject(res);
}
})
.catch(() => {
localStorage.removeItem('jwtToken');
window.location.href = './login';
});
}
如何使 const 加载可重复用于任何导出函数?
是这样的吗?顺便说一句,您可以将加载服务提取到单独的文件中。
简单fiddle来演示这个想法。
https://jsfiddle.net/ramseyfeng/hpaLn9kj/10/
const loading = document.querySelector('.loading-bar');
loading.start = () => {
loading.classList.add('is-loading');
};
loading.stop = () => {
loading.classList.remove('is-loading');
};
export const CreateAPI = (path, dataForm) => {
loading.start();
return Axios.post(`${process.env.REACT_APP_API_SERVER}${path}`, dataForm, {
headers: { 'Content-Type': 'multipart/form-data' }
})
.then(res => {
if (res.status >= 200 && res.status <= 299) {
loading.stop();
return res.status
} else {
Promise.reject(res);
}
})
.catch(err => console.log(err));
}
export const ReadAPI = (path, params) => {
loading.start();
return Axios.get(`${process.env.REACT_APP_API_SERVER}${path}${params || ''}`)
.then(res => {
if (res.status >= 200 && res.status <= 299) {
loading.stop();
return res.data
} else {
Promise.reject(res);
}
})
.catch(() => {
localStorage.removeItem('jwtToken');
window.location.href = './login';
});
}