Ошибка машинописного текста "аргумент типа не может быть назначен параметру типа"

Question

Я относительно новичок в TS, и у меня возникла странная проблема. Кажется, я определил все, но он, похоже, не распознает мой ввод данных.

Вот что у меня:

const Component = () => {
    const [data, setData] = React.useState([[], []])

    React.useEffect(() => {
        fetchData()
    }, [])

    const fetchData = React.useCallback(async () => {
        const data = await fetchDataController()

        setData(data)
                ^^^^ error
    })
}

Это вызывает ошибку,

Argument of type 'Element[][]' is not assignable to parameter of type 'SetStateAction<never[][]>'
  Type 'Element[][]' is not assignable to type 'never[][]'
    Type 'Element[]' is not assignable to type 'never[]'
      Type 'Element is not assignable to type 'never'

Моя функция fetchDataController возвращает массив массивов элементов.

Мой тип следующий:

type TData = {
  id: string,
  desc: string
}

Я пробовал делать что-то вроде,

const [data, setData] = React.useState<Array<TData[], TData[]>>([[], []])

Но, похоже, это не сработало. Что мне здесь не хватает?

Answer 1

Вы были близки. Array<...> требует одного аргумента, типа элементов в массиве. Итак, вы можете сделать что-то вроде Array<TData[]>. Если вы не хотите использовать Array<...>, вы также можете сделать что-то вроде TData[][]

Итак,

React.useState<TData[][]>([[], []])

Вот рабочие коды и ящик с некоторые насмешки

Если вы хотите быть более конкретным c и определить его как Кортеж вместо обычного массива:

React.useState<[TData[], TData[]]>([[], []])

, но для этого вы должны необходимо заверить Typecript, что то, что вы устанавливаете, т.е. data в setData(data), также имеет тип [TData[], TData[]].

Вы можете сделать это с чем-то вроде setData(data as [TData[], TData[]])