如何在 react-native 中修复类型永远不会出现问题

Question

我是本机反应的新手，并且正在关注本教程：enter link description here 现在我们正在制作一系列可滚动的目标，我完全按照他在视频中所做的，但我收到以下错误：

    Argument of type '(currentGoals: never[]) => { key: string; value: string; }[]' is not assignable to parameter of type 'SetStateAction<never[]>'.
  Type '(currentGoals: never[]) => { key: string; value: string; }[]' is not assignable to type '(prevState: never[]) => never[]'.
    Type '{ key: string; value: string; }[]' is not assignable to type 'never[]'.
      Type '{ key: string; value: string; }' is not assignable to type 'never'.ts(2345)

对于函数：第 14 行的 addGoal() 和部分 setGoalsList。但我不明白为什么，因为youtube上的导师和我有相同的代码，但没有得到错误。有人可以指点我的错误是什么吗？

这是我的代码

const [enteredGoal, setGoal] = useState('');
  const [courseGoals, setGoalsList] = useState([]);

  function goalInput(enteredText) {
    setGoal(enteredText)
  };

  function addGOal() {

    setGoalsList(currentGoals => [...currentGoals, {
      key: Math.random().toString(), value: enteredGoal
    }]);

  };


  return (
    <View style={styles.mainContainer}>
      <View style={styles.secondContainer}>
        <Input placeholder="regular" style={styles.textInput}
          onChangeText={goalInput}
          value={enteredGoal}
        >


        </Input>
        <Button onlyIcon icon="plus" iconFamily="antdesign" iconSize={30}
          color="info" iconColor="#fff" style={styles.button}
          onPress={addGOal} />
      </View>


      <FlatList data={courseGoals} renderItem={itemData => (
        <View >
          <Text >
            {itemData.item.value}
          </Text>
        </View>
      )} 
      />

      <View>

      </View>





    </View>

  );
}

Answer 1

const [courseGoals, setGoalsList] = useState([]);

由于这里没有类型信息，因此 typescript 必须尝试推断您所考虑的状态类型。 Typescript 不知道你想要数组的内容是什么，所以它求助于never[]，这对你来说不是很有用。

相反，您需要指定状态是什么类型：

interface Goal {
  key: string;
  value: string;
}

const [courseGoals, setGoalsList] = useState<Goal[]>([]);