Nuxt에서 ES6 클래스를 vuex 저장소 상태로 사용

Nuxt에서 ES6 클래스를 vuex 저장소 상태로 사용

vuex 스토어에서 ES6 클래스를 nuxt로 설정하면 다음 경고가 표시됩니다.

 WARN  Cannot stringify arbitrary non-POJOs EndPoint

그리고 오브젝트를 그대로 사용하면 경고 없이 동작합니다.

그럼 어떻게 하면 제 주에서 ES6 수업을 이용할 수 있을까요?

내 모델:

export default class EndPoint {
    constructor(newEndPoints) {
        this.login = newEndPoints.login;
        this.status = newEndPoints.status;
    }
}

상태 변환:

commit(CoreMutations.SET_ENDPOINTS, new EndPoint(response.data));

오브젝트 사용:

const EndPoint = {
    endPoints(newEndPoints) {
        return {
            login: newEndPoints.login,
            status: newEndPoints.status
        };
    }
};

변환:

commit(CoreMutations.SET_ENDPOINTS, EndPoint.endPoints(response.data));

코멘트에서의 논의에 따라toJSON클래스 내의 메서드는 클라이언트에 상태를 설정할 때 문제를 해결하지만 서버에 상태를 설정할 때 상태는 다음과 같이 됩니다.undefined이 코드를 추가하면 문제가 해결됩니다.

    toJSON() {
        return Object.getOwnPropertyNames(this).reduce((a, b) => {
            a[b] = this[b];
            return a;
        }, {});
    }

언급URL : https://stackoverflow.com/questions/61603040/use-es6-classes-as-vuex-store-state-in-nuxt