TS error: Argument of type 'null' is not assignable to parameter of type 'Error | PromiseLike<Error | undefined> | undefined'.ts(2345)

TS error: Argument of type 'null' is not assignable to parameter of type 'Error | PromiseLike<Error | undefined> | undefined'.ts(2345)

我正在使用 Mobx Persist Store 将 MobX 存储保存到本地存储。

该文档没有 TS 版本,所以我修改了 2 行(一行在 readStore 中,另一行在 writeStore 中,您可以与 https://github.com/quarrant/mobx-persist-store#with-mobx-6 进行比较)以解决 TS 错误但这导致了另一个错误:

import {
    persistence,
    useClear,
    useDisposers,
    isSynchronized,
    StorageAdapter,
} from 'mobx-persist-store'

import { FrameItStore } from '@/store/index'

function readStore(name: string) {
    return new Promise<string>((resolve) => {
        const data = localStorage.getItem(name) || '{}'
        resolve(JSON.parse(data))
    })
}

function writeStore(name: string, content: string) {
    return new Promise<Error | undefined>((resolve) => {
        localStorage.setItem(name, JSON.stringify(content))
        resolve(null)
    })
}

export default persistence({
    name: 'FrameItStore',
    properties: ['counter'],
    adapter: new StorageAdapter({
        read: readStore,
        write: writeStore,
    }),
    reactionOptions: {
        // optional
        delay: 2000,
    },
})(new FrameItStore())

我在 writeStore 内的 resolve(null) 中的 null 上遇到错误。

这是错误:

Argument of type 'null' is not assignable to parameter of type 'Error | PromiseLike<Error | undefined> | undefined'.ts(2345)

我该如何解决?

unknownstringundefined 不兼容。我相信 JSON.parse 正在返回 unknown。因此,您不仅要解析 JSON.parse(data),还必须确定其类型。您可以使用条件检查来做到这一点。一旦你确定它是 string 你就可以解析它,否则解析 undefined.

function readStore(name: string) {
    return new Promise((resolve) => {
        const data = localStorage.getItem(name) || '{}'
        const output = JSON.parse(data);
        if (typeof output === "string") resolve(output);
        resolve(undefined);
    })
}

我想我已经解决了,因为我现在没有看到任何错误。我不得不从 readStore 中删除 JSON.parse,并在 writeStore 中使用 resolve(undefined) 而不是 resolve(null),例如:

import {
    persistence,
    useClear,
    useDisposers,
    isSynchronized,
    StorageAdapter,
} from 'mobx-persist-store'

import { FrameItStore } from '@/store/index'

function readStore(name: string) {
    return new Promise<string>((resolve) => {
        const data = localStorage.getItem(name) || '{}'
        resolve(data)
    })
}

function writeStore(name: string, content: string) {
    return new Promise<Error | undefined>((resolve) => {
        localStorage.setItem(name, JSON.stringify(content))
        resolve(undefined)
    })
}

export const PersistState = persistence({
    name: 'FrameItStore',
    properties: ['counter'],
    adapter: new StorageAdapter({
        read: readStore,
        write: writeStore,
    }),
    reactionOptions: {
        // optional
        delay: 2000,
    },
})(new FrameItStore())