Vue.set - неверный тип, выведенный с помощью TypeScript

Question

Я создаю модуль Vuex и в своей мутации я устанавливаю объект другому объекту, используя ключ: obj [key] = newobj. Также я использую машинопись здесь.

Дано:

// store state interface
export interface Office {
    id: number;
    name: string;
    zip?: string;
    city?: string;
    address?: string;
    phone?: string;
    phone2?: string;
}

export interface Organization {
    [key: string]: any;

    id: number;
    name: string;
    offices: { [key: string]: Office };
}

// store action
const setOffice = (state: OrganizationState, item: Office) => {
    Vue.set<Office>(state.offices, item.id, item);
    // or, it does not change much
    Vue.set(state.offices, item.id, item);
};

TypeScript выдает мне ошибку:

25:19 Argument of type '{ [key: string]: Office; }' is not assignable to parameter of type 'Office[]'.
Property 'includes' is missing in type '{ [key: string]: Office; }'.

    23 | 
    24 | const setOffice = (state: OrganizationState, item: Office) =>{
  > 25 |     Vue.set<Office>(state.offices, item.id, item);
       |                   ^
    26 | };

В наборе есть 2 версии Vue.set - одна для объекта, другая для массива:

// vue/types/vue.d.ts
export interface VueConstructor<V extends Vue = Vue> {
    set<T>(object: object, key: string, value: T): T;
    set<T>(array: T[], key: number, value: T): T;
}

В моем случае всегда используется тип array .

Answer 1

Проблема в том, что ваш второй параметр (item.id) является числом, и это делает вызов несовместимым с первой перегрузкой, которая ожидает string в качестве второго аргумента.

Простое решение - преобразовать id в string в вызове:

Vue.set<Office>(state.offices, item.id.toString(), item);