typescript - ts、useStorage (vueuse) 和 Pinia 类型的问题

Question

我在以下代码中遇到了一个奇怪的错误： Property 'length' does not exist on type '{ [RefSymbol]: true; }'.

但是当我检查foogetCount 函数中的类型时，我的 IDE 告诉我它的类型Foo[]。我究竟做错了什么？

import { defineStore } from 'pinia';
import { useStorage } from '@vueuse/core';

interface Foo {}

export const useFooStore = defineStore('foo', {
  state: () => ({
    foo: useStorage('foo', [] as Foo[]),
  }),
  actions: {
    getCount() {
      return this.foo.length; //Here's the error
    },
  },
});

Answer 1

现在您的帖子中没有太多信息，但从错误消息中我猜到以下内容。您正在使用类型定义一个对象

{ [RefSymbol]: true; }

但是由于您的类型上不存在长度，我认为工作需要一个数组吗？

Answer 2

当我在错误的行前面加上

/* eslint-disable @typescript-eslint/ban-ts-comment */
// @ts-ignore
return this.foo.length; //Here used to be the error

然后它突然起作用了。这很丑陋，但它有效

Answer 3

我认为的返回值useStorage不是你想的那样。我相信它会返回一个 ref，其value属性包含正在存储的实际数据。

尝试：

useStorage('jobs', [] as Job[]).value