Тип ошибки Typescript не может быть назначен для состояния - usestate - PullRequest
Новая
       109

Тип ошибки Typescript не может быть назначен для состояния - usestate

0 голосов
/ 09 мая 2020

Я новичок в типе скрипта, и я пытаюсь установить состояние в ответ, используя ловушку состояния и тип скрипта. 

const intialState: State ={
    items: [],
    value: "",
    error: null
}

const [data, setData]= useState([intialState]);

return (
    <>
        {
            data.items.map(x) => (
                //my html component to be displayed.
            )
        }
    </>
)

, но я получаю следующую ошибку. Может ли кто-нибудь мне сказать.

  1. Допустимо ли устанавливать объект внутри состояния использования, как это сделал я?
  2. Почему я получаю ошибку машинописного текста?

enter image description here

Ответы [ 3 ]

1 голос
/ 09 мая 2020

Вам необходимо указать тип для useState. Поскольку это массив вашего объекта состояния, вы можете записать его как 

const [data, setData]= useState<State[]>([intialState]);

Также убедитесь, что вы определили тип для вашего объекта состояния 

interface ErrorType {
   status: Number // more keys and their types here
}
interface MyDataType {
  items: ItemType[],
  error: ErrorType | null,
  value: string,
}

post, который вы можете использовать с useState например, 

const [data, setData]= useState<MyDataType[]>([intialState]);

Ваши данные представляют собой массив объектов, и когда вы обновляете состояние, вам необходимо объединить значения. Для этого можно использовать функционал setState 

var updatedDataObj = { items: ["a","b","c"], error: "404", value: "xyx", };
setData(prevData => [...prevData, updatedDataObj]);
1 голос
/ 09 мая 2020

Думаю, это было то, чего вы пытались достичь. Убедитесь, что вы правильно определили тип своего состояния, а не из других пакетов 

interface State {
    items: any[];
    value: string;
    error: string | null;
}


const MyComponent: (props) => {
    const intialState: State ={
        items: [],
        value: "",
        error: null
    }
    const [data, setData] = useState(intialState)


return (
   <>
        {
            data.items.map(x) => (
                //my html component to be displayed.
            )
        }
    </>
    )
}
1 голос
/ 09 мая 2020

Сначала мы должны проверить, есть ли несоответствие интерфейса между State и объектом initialState. Это поможет, если вы можете опубликовать определение типа State.

Кроме того, вы должны предоставить хук useState с параметром generi c типа State[]

const [data, setData]= useState<State[]>([intialState]);
...