React Hooks - 作為prop傳遞的函數組件內的函數無法訪問狀態

Question

我已閱讀有關React鈎子的信息，並希望在我開發的這個新網站上試用它。 我試圖傳遞異步函數作為道具。 該函數的一部分是設置我的“城市”狀態和控制台日志，以查看API是否有效。 我一直在接收“setCities不是函數”錯誤，或者如果我只是直接控制台登錄，則返回undefined。 我認為該函數無法訪問{cities, setCities}狀態。 我已經在類組件中嘗試了它並且它可以工作。 有沒有人遇到類似的情況？ 以下是代碼示例：

import React, { useState } from "react";
import axios from "axios";
import Menu from "./Menu";

function App() {
    const { cities, setCities } = useState([]);

    const searchSubmit = async term => {
        try {
            const res = await axios.get("http://localhost:8080/general/search", {
                params: { city: term }
            });
            setCities(res.data);
            console.log(cities);
        } catch (err) {
            console.log(err.message);
        }
    };

    return (
        <div className="ui container">
            <Menu handleSearchSubmit={searchSubmit} />
        </div>
    );
}

Answer 1

useStates返回一個數組，而不是一個對象......

所以你可以改變

const { cities, setCities } = useState([]);

至

const [ cities, setCities ] = useState([]);

它應該工作。