Mixin 내 VueX

Mixin 내 VueX

코드를 너무 많이 쓰기 전에 내가 하고 있는 일이 맞는지 개념적으로 이해할 수 있을 것 같았다.

믹스인을 가져오는 컴포넌트가 몇 개 있습니다.mixin에는 (HATEOAS) API에서 일부 링크를 가져오는 웹 API 호출이 있으므로 UI는 자체 링크를 형성하지 않고 링크를 사용할 수 있습니다.예를 들어 다음과 같습니다.

[
        {
            "Rel": "GetSupportingData",
            "Href": "https://api.com/SupportingData"
        },
        {
            "Rel": "Search",
            "Href": "https://api.com/Search"
        }
]

따라서 MIXIN에는 GetLink("Search")라는 이름의 메서드가 있습니다.이 메서드는 API에서 링크를 취득하여 요청된 링크를 반환합니다.

이것은 괜찮습니다만, mixin이 많은 컴포넌트로 Import 되어 있기 때문에, 필터링 전에 링크를 취득하기 위해서 WEB API 호출을 할 때마다 사용하고 싶지 않습니다.따라서 Vuex를 사용하여 링크 상태를 관리하고 스토어 수가 0인 경우 링크 상태를 가져와야 하는지 궁금했습니다.

지금까지 본 Vuex의 예에서는 컴포넌트에서 인스턴스화 되어 있기 때문에 올바르게 동작하지 않을 수 있습니다.

웹 API 링크를 저장하기 위해 하나의 접근 방식이지만 페이지를 다시 새로 고칠 경우 스토어는 API 링크로 채워져야 합니다.

따라서 local Storage 또는 indexed를 사용하는 방법도 있습니다.브라우저 DB

응용 프로그램을 처음 로드할 때마다 로컬 스토리지 또는 indexedDB로 이동하여 api 링크를 확인합니다.존재하는 경우 Vues 저장소로 복원됩니다.또는 mixin 메서드를 호출하여 브라우저 스토리지 및 vuex 스토어로 API 링크 및 로드를 가져옵니다.

언급URL : https://stackoverflow.com/questions/58321158/vuex-within-mixin