我正在尝试将数组保存为状态,然后我想以某种方式遍历dom中保存为状态的数组,以使用数组中的每个项创建一个无序列表
import React, { useState } from 'react';
const Worbli: React.FC = () => {
const [state, setState] = useState({
myArray = '';
});
const theArrayToSave = ['apple', 'orange', 'peach']
setState({ ...state, myArray: theArrayToSave });
return (
<ul>
{ state.myArray.map( (fruit:string,index:number) => (<li key={index} >{fruit}</li>)) }
</ul>
)
}
我得到的错误是
Argument of type '{ myArray: string[]; accountNameError: string; loading: boolean; }' is not assignable to parameter of type 'SetStateAction<{ accountNameError: string; loading: boolean; myArray: string; }>'.
Type '{ myArray: string[]; }' is not assignable to type '{ myArray: string; }'.
Types of property 'myArray' are incompatible.
Type 'string[]' is not assignable to type 'string'.ts(2345)
您应该这样声明您的状态:
const [state, setState] = useState({
myArray: [];
});
但是,正如您前面提到的,这使它成为never[]
类型而不是string[]
类型,并且仍然会引发错误。为了解决这个问题,您应该像这样在状态声明中添加类型:
interface IState {
accountNameError: string;
loading: boolean;
myArray: string[];
}
const [state, setState] = useState<IState>({
accountNameError: "",
loading: false,
myArray: []
});
这样,您可以明确告诉TypeScript
您状态值应该是什么样。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句