Question

我不久前开始研究反应，我做了一个选择从外部api取值的项目，它工作正常。当我去进行本机操作时，要执行相同的项目，实际上是由于对打字稿的某些控制，最终被卡在选择器的使用中。

这是我的代码：

interface IBGEUFResponse {
  sigla: string;
}

interface IBGECityResponse {
  nome: string;
}

const Home = () => {
  const [ufs, setUfs] = useState<string[]>([]);
  const [cities, setCities] = useState<string[]>([]);
  const [selectedUf, setSelectedUf] = useState('');
  const [selectedCity, setSelectedCity] = useState('');

在这里有一些使用效果和控制：

useEffect(() => {
    axios.get<IBGEUFResponse[]>('https://servicodados.ibge.gov.br/api/v1/localidades/estados?orderBy=nome')
    .then(response => {
      const ufInitials = response.data.map(uf => uf.sigla);

      setUfs(ufInitials);
    });
  }, []);

  useEffect(() => {
    if(selectedUf === '') {
      return;
    }

    axios.get<IBGECityResponse[]>(`https://servicodados.ibge.gov.br/api/v1/localidades/estados/${selectedUf}/municipios`)
    .then(response => {
      const cityNames = response.data.map(city => city.nome);

      setCities(cityNames);
    });
  }, [selectedUf]);

最后是选择器：

<Picker
            style={styles.input}
            selectedValue={selectedUf}
            onValueChange={newUf => setSelectedUf(newUf)}
          >
            {ufs.map(uf => {
           return (
           <Picker.Item key={uf} label={uf} value={uf}
            />
           );})}

所以setSelectedUf(newUf)在（newUf）中出现（TS：2345）错误，我看不到如何使它工作。

对不起，但是我花了几天的时间在互联网上寻找解决方案，针对类似的错误调整了解决方案，但我无法解决。

带钩打字稿的React-native Picker

0 个答案: