Typescript/React-Native：类型为“string |”的参数 null' 不可分配给类型为 'SetStateAction<never[]>' 的参数

Question

我正在学习typescript并且React-Native我想使用AsyncStorage图书馆。从存储读取值后设置状态时，我遇到了这个问题：

常量值：字符串| null 类型为 'string | 的参数 null' 不能分配给'SetStateAction<never[]>' 类型的参数。类型“null”不可分配给类型“SetStateAction<never[]>”

该应用程序显示了价值，但我想了解如何解决问题。我想我必须将 a 分配type给useState，但不知道如何分配SetStateAction类型。

如何设置类型来useState解决这个问题？

这是示例代码：

import React, {useEffect, useState} from 'react';
import {Text, View} from 'react-native';
import AsyncStorage from '@react-native-async-storage/async-storage';

const App = () => {
  const [value, setValue] = useState([]);
  
  async function saveValue(key: string, value: string) {
    await AsyncStorage.setItem(key, value);
  }
  
  async function readValue(key: string) {
    const value = await AsyncStorage.getItem(key);
    setValue(value);
  }

  useEffect(() => {
    saveValue('123', 'Hello world! ');
    readValue('123');
  }, []);

  return (
    <View>
      <Text>{value}</Text>
    </View>
  );
};

export default App;

谢谢。

Answer 1

按照@Mic Fung 的建议使用const [value,setValue] = useState<string | null>('');修复了问题。这是生成的代码：

const App = () => {
  const [value, setValue] = useState<string | null>('');
    
async function saveValue(key: string, value: string) {
    await AsyncStorage.setItem(key, value);
  }

async function readValue(key: string) {
    const value = await AsyncStorage.getItem(key);
    setValue(value);
  }

  useEffect(() => {
    saveValue('123', 'Hello world! ');
    readValue('123');
  }, []);

  return (
    <View>
      <Text>{value}</Text>
    </View>
  );
};

你好世界！