Vuex абстрактные распространенные методы наследования (Large SPA) - PullRequest
Новая
       66

Vuex абстрактные распространенные методы наследования (Large SPA)

0 голосов
/ 03 мая 2020

Большой SPA Vuex вопрос - есть ли способ абстрагировать общие методы, которые могут быть унаследованы или внедрены в модули пространства имен Vuex? То, что у меня есть ниже, работает, но я чувствую себя глупо, поскольку мне приходится стандартизировать штаты и т. Д. c. Я мог бы пройти в ассо c. ключи массива для размещения различных государственных хранилищ, но в поисках оптимизации. Я смотрю на плагины Vuex и думаю, что есть способ использовать это до некоторой степени, но опять же не идеально, если я хотел что-то столь же простое, как getById()

Другой подход - создать Vue IoC factory container, Vue provider, with a Vuex driver, services for for common components, но это это много накладных расходов, и я чувствую, что это будет излишним, но, возможно, это лучший подход для большого SPA. Был бы признателен за некоторые рекомендации относительно того, где это правильный подход.

vuex-common. js

Коллекция общих методов обслуживания. Я мог бы создать общее для добытчиков, мутаций, действий и т. Д. c. 

import isArray from 'lodash/isArray'

export function getById () {
    return state => {
        const find = val => state.data.find(x => x.id === val)
        return val => isArray(val) ? val.map(find) : find(val)
    }
}

Пример хранилища пространства имен - store / modules / Users. js

// removed other imports for brevity sake

import { getById } from 'vuex-common'
import forEach from 'lodash/forEach'
import {fetchUsers} from '~/api/apis/users.api';

const initialState = () => ({
    data: []
});

const state = initialState();

const getters = {
    getById: getById() // vuex-common
    // removed other getters for brevity sake
}

const actions = {
    async getUsers({commit, getters}) {
        try {
            const {data} = await fetchUsers();

            forEach(data, (u) => {
                /* Import getById vuex-common function */
                if (!getters.getById(u.id)) { 
                    commit('ADD_USER', u);
                }
            });

        } catch (e) {
            console.error("ERROR", e.message, e.name);
        }
    },
}

// removed mutations and exports for brevity sake
...