CODEWITHSUNDEEP
javascriptreactjstypescriptnext.js
Rez Mohsnei
Rez Mohsnei

Reputation: 207

Typescript: Property 'set' does not exist on type '{}'.ts

This is my store.tsx:

let store = {};

const globalStore = {};

globalStore.set = (key: string, value: string) => {
    store = { ...store, [key]: value };
}

globalStore.get = (key) => {
    return store[key];
}

export default globalStore;

And I use it:

import globalStore from './library/store';

function MyApp({ Component, pageProps }: AppProps) {
    globalStore.set('cookie', pageProps.cookies);
    return <Component {...pageProps} />
}

But I get this error:

Property 'set' does not exist on type '{}'.ts

My code work fine, but I don't want get any error.

Actually, I want to store my data to variable and use it from another component.

Upvotes: 0

Views: 1665

Answers (1)

Elias
Elias

Reputation: 4112

Well you basically declared the type of the variable as {}, and you can't easily change that after the fact.

So you need to declare the functions inside to object so typescript can infer the correct type of GlobalStore (with the methods):

const store: Record<string, string> = {};

const GlobalStore = {
    set: (key: string, value: string) => {
        store[key] = value;
    },
    get: (key: string): string => {
        return store[key];
    }
}

export default GlobalStore;

The correct type of GlobalStore would be (in opposition to the {} you currently have):

interface GloabStore {
    set(key: string, value: string): void;
    get(key: string): string;
}

And btw, what you are implementing is basically a (Hash)Map, so I think you could just do:

const GlobalStore = new Map<string, string>();

export default GlobalStore;

Upvotes: 2

Related Questions