将ES6类用作nuxt中的存储状态时出现问题

Question

我在nuxt项目中使用vuex-module-decorators，并且想使用ES6类来表示商店的状态。但是在SSR中不起作用。

这是我商店的模块：

@Module({
    name: "User",
    stateFactory: true,
    namespaced: true,
})
export default class User extends VuexModule {
    currentUser: UserModel | null = null;
    loading: boolean = false;

    @Mutation
    SET_CURRENT_USER(payload: UserModel) {
        this.currentUser = payload;
    }

    @Mutation
    SET_GET_USER_LOADING(payload: boolean) {
        this.loading = payload;
    }

    @Action({ rawError: true })
    async getCurrentUser({ reloading = true, userId }: GetCurrentUserProps) {
        if (reloading) {
            this.context.commit("SET_GET_USER_LOADING", true);
        }
        const response = await UserApi.getUser(userId);
        if (response.success) {
            this.context.commit("SET_CURRENT_USER", new UserModel(response.data as UserProps));
        }
        this.context.commit("SET_GET_USER_LOADING", false);
    }
}

这是我的用户模型：

export default class User extends Store {
    userId: string;
    firstName: string;
    lastName: string;
    email: string;
    username: string;
    avatar?: string;
    role: UserRole;
    teacherInfo?: TeacherInfoProps;
    constructor(props: UserProps) {
        super();
        this.userId = props.userId;
        this.firstName = props.firstName;
        this.lastName = props.lastName;
        this.email = props.email;
        this.username = props.username;
        this.avatar = props.avatar;
        this.role = props.role;
        this.teacherInfo = props.teacherInfo;
    }

    get fullName(): string {
        return `${this.firstName} ${this.lastName}`;
    }
}

当在客户端（ CSR ）中导航时，未定义服务器（ SSR ）user.fullName中的页面呈现时，则起作用。

如何正确使用ES6类？