在React Typescript中使用axios创建服务

Question

有两种不同的方法可以从所需的功能组件创建服务和调用。

1。

export const userProfileService = {
ResetPassword: async (userId: string) => {
var response = await http.get<string, boolean>(`UserProfile/ResetPassword?userId=${userId}`);
return response;
}
}

class UserProfileService {
readonly userProfilePath = 'UserProfile';
resetPassword = async (userId: string) => {
var response = await http.get<string, boolean> 
(`${this.userProfilePath}/ResetPassword?userId=${userId}`);
return response;
}
export default new UserProfileService();

**The question is which way is better and optimized way? or better convention?**

Answer 1

为什么不把它变成一个函数呢?

export const resetPassword: async (userId: string) => {
return await http.get<string, boolean>(`UserProfile/ResetPassword?userId=${userId}`);
}

在这种情况下，将函数放在类或对象中似乎只会使其变得复杂和模糊。它看起来很像受c#影响的风格。从本质上讲，这并不可怕或错误，但当您所需要的只是一个纯函数时，它有点冗长和复杂。

另外，由于范围的差异，您应该使用let或const关键字而不是var。您不会在上面的代码中犯任何错误，因为var是函数作用域的，但是使用const(或let，如果您需要修改它)几乎总是更好的。