在反应中遇到打字稿问题答案

【问题标题】：Having issues with typescript in react在反应中遇到打字稿问题
【发布时间】：2021-10-20 20:36:08
【问题描述】：

我在尝试定义值时遇到 typescript react in 的问题。

这是错误：

类型“{}”的参数不能分配给类型参数 'SetStateAction'。类型“{}”不可分配给类型 '(prevState: boolean[]) => boolean[]'。类型“{}”不匹配签名“(prevState: boolean[]): boolean[]'.ts(2345)

这是我的以下代码：

const [addButtonFruits, setAddButtonFruits] = useState([true]);

useEffect(() => {
    const initialAddButtonFruits = {};
    fruitsArray.map((each) => (initialAddButtonFruits[each] = true));
    setAddButtonFruits(initialAddButtonFruits);
  }, []); // only executed for initial rendering

【问题讨论】：

标签： javascript reactjs typescript react-hooks

【解决方案1】：

错误消息准确地说明了问题所在。您的状态变量 addButtonFruits 是一个布尔数组。而您正试图为其分配一个对象。

试试：

    const initialAddButtonFruits = fruitsArray.map(each => true);
    setAddButtonFruits(initialAddButtonFruits);

如果你想存储一个对象：

const [addButtonFruits, setAddButtonFruits] = useState({});

useEffect(() => {
    const initialAddButtonFruits = {};
    fruitsArray.forEach((each) => (initialAddButtonFruits[each] = true));
    setAddButtonFruits(initialAddButtonFruits);
  }, []); // only executed for initial rendering

【讨论】：

【解决方案2】：

addButtonFruits 是一个布尔数组。您不能将空对象分配给布尔数组变量。

const initialAddButtonFruits = [];

【讨论】：